js dom操作方法

// 获取元素
// 使用 document.getElementById() 方法获取单个元素
let element = document.getElementById('myElement');
// 解释：通过 ID 'myElement' 获取页面中的一个元素，并将其赋值给变量 element

// 修改元素内容
element.innerHTML = '新的内容';
// 解释：将获取到的元素的 HTML 内容修改为 '新的内容'

// 添加类名
element.classList.add('newClass');
// 解释：为获取到的元素添加一个新的类名 'newClass'

// 移除类名
element.classList.remove('oldClass');
// 解释：从获取到的元素中移除类名 'oldClass'

// 设置属性
element.setAttribute('data-value', '123');
// 解释：为获取到的元素设置自定义属性 'data-value'，并赋值为 '123'

// 获取属性
let value = element.getAttribute('data-value');
// 解释：获取元素的 'data-value' 属性值，并将其赋值给变量 value

// 创建新元素
let newElement = document.createElement('div');
// 解释：创建一个新的 <div> 元素，并将其赋值给变量 newElement

// 添加子元素
element.appendChild(newElement);
// 解释：将新创建的元素作为子元素添加到已有的元素中

// 移除子元素
element.removeChild(newElement);
// 解释：从已有的元素中移除指定的子元素

// 监听事件
element.addEventListener('click', function() {
    console.log('元素被点击了');
});
// 解释：为元素添加点击事件监听器，当元素被点击时，在控制台输出 '元素被点击了'