js实现追加

追加元素到DOM

在JavaScript中，可以通过多种方法将元素追加到DOM中。以下是几种常见的实现方式：

使用appendChild方法

const parentElement = document.getElementById('parent');
const newElement = document.createElement('div');
newElement.textContent = '新添加的内容';
parentElement.appendChild(newElement);

使用insertAdjacentHTML方法

const parentElement = document.getElementById('parent');
parentElement.insertAdjacentHTML('beforeend', '<div>新添加的内容</div>');

使用innerHTML属性

const parentElement = document.getElementById('parent');
parentElement.innerHTML += '<div>新添加的内容</div>';

追加内容到数组

在JavaScript中，可以使用多种方法向数组追加元素：

使用push方法

const array = [1, 2, 3];
array.push(4);
console.log(array); // [1, 2, 3, 4]

使用扩展运算符

let array = [1, 2, 3];
array = [...array, 4];
console.log(array); // [1, 2, 3, 4]

使用concat方法

const array = [1, 2, 3];
const newArray = array.concat(4);
console.log(newArray); // [1, 2, 3, 4]

追加文本到字符串

使用加号运算符

let str = 'Hello';
str += ' World';
console.log(str); // 'Hello World'

使用模板字符串

let str = 'Hello';
str = `${str} World`;
console.log(str); // 'Hello World'

追加数据到对象

使用点表示法或方括号表示法

const obj = { a: 1 };
obj.b = 2;
console.log(obj); // { a: 1, b: 2 }

使用Object.assign方法

const obj = { a: 1 };
Object.assign(obj, { b: 2 });
console.log(obj); // { a: 1, b: 2 }

使用扩展运算符

const obj = { a: 1 };
const newObj = { ...obj, b: 2 };
console.log(newObj); // { a: 1, b: 2 }

以上方法可以根据具体需求选择适合的方式来实现追加操作。