JavaScript 元素属性61

在 JavaScript 中，元素属性可以用于访问和操作 HTML 元素的属性值。属性提供了一种在运行时动态更改元素外观和行为的方法。

属性访问

可以使用点号 (.) 符号或 getAttribute() 方法访问元素属性。点号符号是更方便的方法，但仅适用于标准属性。要访问自定义属性，必须使用 getAttribute() 方法。
// 使用点号符号
const width = ;
// 使用 getAttribute() 方法
const customAttr = ("data-custom-attr");

属性修改

可以使用点号符号或 setAttribute() 方法修改元素属性。与属性访问类似，点号符号适用于标准属性，而 setAttribute() 方法适用于所有属性。
// 使用点号符号
= "200px";
// 使用 setAttribute() 方法
("data-custom-attr", "custom value");

最常用的属性

以下是 JavaScript 中一些最常用的元素属性：
id: 元素的唯一标识符。
className: 元素的 CSS 类列表。
style: 元素的 CSS 样式。
value: 输入元素（如文本框或文本区域）的值。
checked: 复选框或单选按钮是否选中。
disabled: 元素是否禁用。
hidden: 元素是否隐藏。
href: 锚（）元素的链接。
src: 图像（）或视频（）元素的来源。

属性属性

除了访问和修改属性值外，JavaScript 还提供了以下属性属性：
hasAttribute(): 检查元素是否具有特定属性。
removeAttribute(): 从元素中删除属性。
getAttributeNames(): 获取元素所有属性的名称数组。

示例

以下是一些使用 JavaScript 元素属性的示例：
// 访问元素的 id
const id = ("my-element").id;
// 修改元素的样式
("my-element"). = "blue";
// 禁用元素
("my-element").disabled = true;
// 检查元素是否具有 data-custom-attr 属性
const hasCustomAttr = ("my-element").hasAttribute("data-custom-attr");

JavaScript 元素属性提供了访问、修改和操作 HTML 元素属性值的强大方法。通过了解这些属性，开发人员可以动态更改元素的外观和行为，从而创建更强大、更交互式的 Web 应用程序。

2025-02-04

上一篇：JavaScript 对象变量：全面指南

下一篇：如何使用 JavaScript 过滤 HTML