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

时间:2025-03-29 21:01:04

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

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

    示例:

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

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

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

   示例:

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

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

    示例:

// 修改元素的样式属性
 = 'red';

// 添加CSS类名
('newClass');

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

// 设置元素的属性
('src', '');

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

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