js里各种效果代码

// 简单的淡入淡出效果
function fadeIn(element, duration) {
    let opacity = 0;
    element.style.opacity = opacity;
    const timer = setInterval(() => {
        if (opacity >= 1) {
            clearInterval(timer);
        }
        element.style.opacity = opacity;
        opacity += 0.1;
    }, duration / 10);
}

// 使用示例
const box = document.getElementById('myBox');
fadeIn(box, 1000); // 1秒内淡入

function validateForm() {
    const name = document.forms["myForm"]["name"].value;
    if (name === "") {
        alert("Name must be filled out");
        return false;
    }
}

// 使用fetch API获取数据并更新页面内容
fetch('https://api.example.com/data')
    .then(response => response.json())
    .then(data => {
        document.getElementById('content').innerHTML = data.content;
    })
    .catch(error => console.error('Error:', error));

function animate() {
    // 动画逻辑
    requestAnimationFrame(animate);
}
animate();