JS获取元素、修改元素的内容、样式、属性--详解

在 JavaScript 中，您可以使用以下方法来获取元素、修改元素的内容、样式和属性：

1. 获取元素：
   使用 `getElementById()` 方法通过元素的 id 属性获取元素。
   使用 `querySelector()` 方法通过 CSS 选择器获取元素。

    示例:

// 通过id获取元素
const elementById = document.getElementById('elementId');

// 通过CSS选择器获取元素
const elementBySelector = document.querySelector('.className');

2. 修改元素的内容：
   使用 `innerHTML` 属性来设置元素的 HTML 内容。

   示例:

// 修改元素的HTML内容
elementById.innerHTML = '新的内容';

3. 修改元素的样式：
   使用 `style` 对象来设置元素的样式属性或者通过添加、移除 CSS 类名称来改变元素的样式。

    示例:

// 修改元素的样式属性
elementBySelector.style.color = 'red';

// 添加CSS类名
elementBySelector.classList.add('newClass');

4. 修改元素的属性：
   使用 `setAttribute()` 方法来设置元素的属性。
   使用直接赋值的方式来修改某些特殊属性，如 `value`、`checked` 等。

// 设置元素的属性
elementById.setAttribute('src', 'image.jpg');

// 直接赋值修改特殊属性
inputElement.value = '新值';

请注意，上述方法仅为常见示例，实际操作可能根据具体情况略有不同。另外，对于动态创建的元素，您可以使用 `createElement()` 方法创建新的元素，并使用 `appendChild()` 方法将其添加到文档中。