JavaScript实例大全
介绍
JavaScript是一种广泛应用于网页开发的脚本语言，它可以为网页增加交互性和动态效果。随着Web技术的快速发展，JavaScript已经成为了前端开发的重要组成部分。
本文将介绍一些常见的JavaScript实例，包括数组操作、字符串处理、DOM操作、事件处理等。通过这些实例，读者可以更好地理解JavaScript的基本语法和常见应用场景。
数组操作
在JavaScript中，数组是一种容器，可以存储多个值。下面是一些常见的数组操作示例：
创建数组
使用[]或Array()可以创建一个空数组：
const arr = [];
// 或者
const arr = new Array();
也可以在创建数组时指定初始值：
const arr = [1, 2, 3];
// 或者
const arr = new Array(1, 2, 3);
添加元素
可以使用push()方法向数组末尾添加元素：
const arr = [1, 2, 3];
arr.push(4);
// arr现在为[1, 2, 3, 4]
也可以使用unshift()方法向数组开头添加元素：
const arr = [1, 2, 3];
arr.unshift(0);
// arr现在为[0, 1, 2, 3]
删除元素
可以使用pop()方法删除数组末尾的元素：
const arr = [1, 2, 3];
arr.pop();
// arr现在为[1, 2]
也可以使用shift()方法删除数组开头的元素：
const arr = [1, 2, 3];
arr.shift();
// arr现在为[2, 3]
判断元素是否存在
可以使用includes()方法判断数组中是否包含某个元素：
const arr = [1, 2, 3];
arr.includes(2); // 返回true
arr.includes(4); // 返回false
数组遍历
可以使用for...of循环遍历数组中的每个元素：
const arr = [1, 2, 3];
for (const item of arr) {
console.log(item);
}
// 输出1、2、3
字符串处理
JavaScript中的字符串是一组字符的序列，可以对字符串进行各种操作。下面是一些常见的字符串处理示例：
字符串拼接
可以使用+运算符将多个字符串拼接在一起：
const str1 = 'Hello';
const str2 = 'World';
const result = str1 + ' ' + str2;
// result为'Hello World'
也可以使用模板字符串（Template String）来拼接字符串：
const str1 = 'Hello';
const str2 = 'World';
const result = `${str1} ${str2}`;
// result为'Hello World'
字符串查找
可以使用indexOf()方法查找字符串中是否包含某个子串：
const str = 'Hello World';
str.indexOf('World'); // 返回6
str.indexOf('JavaScript'); // 返回-1，表示未找到
字符串替换
可以使用replace()方法将字符串中的某个子串替换为新的字符串：
const str = 'Hello World';
const result = str.replace('World', 'JavaScript');
// result为'Hello JavaScript'
字符串分割
可以使用split()方法将字符串分割为一个字符串数组：
const str = 'Apple, Banana, Orange';
const arr = str.split(', ');
// arr为['Apple', 'Banana', 'Orange']
DOM操作
DOM（Document Object Model）是HTML文档的对象表示，可以用JavaScript来操作和修改DOM元素。下面是一些常见的DOM操作示例：
获取元素
可以使用getElementById()方法根据元素的id获取DOM元素：
const element = document.getElementById('myElement');
也可以使用querySelector()方法根据CSS选择器获取DOM元素：
const element = document.querySelector('.myClass');
修改元素内容
可以使用innerHTML属性修改元素的内容：
const element = document.getElementById('myElement');
element.innerHTML = 'Hello World';
