js 代码实例大全

以下是一些常见的 JavaScript 代码实例：

一、DOM 操作

获取元素并修改其内容

// 获取 id 为 "myElement" 的元素
var element = document.getElementById("myElement");
// 修改元素的文本内容
element.innerText = "新的内容";

添加新元素

// 创建一个新的 <p> 元素
var newParagraph = document.createElement("p");
newParagraph.innerText = "这是新添加的段落";
// 将其添加到 <body> 中
document.body.appendChild(newParagraph);

二、事件处理

点击按钮弹出提示框

// 获取按钮元素
var button = document.getElementById("myButton");
// 添加点击事件监听器
button.addEventListener("click", function() {
    alert("按钮被点击了！");
});

鼠标悬停改变元素样式

var element = document.getElementById("myElement");
element.addEventListener("mouseover", function() {
    element.style.backgroundColor = "yellow";
});
element.addEventListener("mouseout", function() {
    element.style.backgroundColor = "";
});

三、函数

计算两个数的和

function add(a, b) {
    return a + b;
}
var result = add(2, 3);
console.log(result);

判断一个数是否为偶数

function isEven(number) {
    return number % 2 === 0;
}
var num = 4;
if (isEven(num)) {
    console.log(num + " 是偶数");
} else {
    console.log(num + " 不是偶数");
}

四、数组操作

遍历数组并打印每个元素

var arr = [1, 2, 3, 4, 5];
arr.forEach(function(item) {
    console.log(item);
});

过滤出数组中的偶数

var numbers = [1, 2, 3, 4, 5, 6];
var evenNumbers = numbers.filter(function(number) {
    return number % 2 === 0;
});
console.log(evenNumbers);

五、异步编程（使用 Promise）

模拟一个异步获取数据的操作

function fetchData() {
    return new Promise(function(resolve, reject) {
        setTimeout(function() {
            resolve("数据获取成功！");
        }, 2000);
    });
}

fetchData().then(function(data) {
    console.log(data);
}).catch(function(error) {
    console.error(error);
});

这些只是 JavaScript 中的一小部分常见代码实例，JavaScript 的应用非常广泛，还包括与后端交互、处理表单数据、创建动画效果等等。