Element.attributes
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since July 2015.
Element.attributes
属性返回一个注册到指定节点的所有属性节点的实时集合。该集合是一个 NamedNodeMap
对象,不是 Array
,所以它没有 Array
的方法,其包含的 Attr
节点的索引顺序随浏览器不同而不同。更确切地说,attributes
是字符串形式的键值对,代表了那个属性的任何信息。
值
一个 NamedNodeMap
对象。
示例
基本示例
js
// 获取文档中的第一个 <p> 元素
const paragraph = document.querySelector("p");
const attributes = paragraph.attributes;
遍历元素的属性
你可以使用 for...of
枚举一个元素的所有属性。
在以下例子中会遍历文档中 id 为“paragraph”的元素的属性节点,并打印出来。
html
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<title>属性示例</title>
<script>
function listAttributes() {
const paragraph = document.getElementById("paragraph");
const result = document.getElementById("result");
// 首先,确定那个段落有一些属性
if (paragraph.hasAttributes()) {
let output = "Attributes of first paragraph:\n";
for (const attr of paragraph.attributes) {
output += `${attr.name} -> ${attr.value}\n`;
}
result.textContent = output;
} else {
result.textContent = "没有可显示的属性";
}
}
</script>
</head>
<body>
<p id="paragraph" style="color: green;">示例段落</p>
<form action="">
<p>
<input type="button" value="显示第一个属性名及其值"
onclick="listAttributes();">
<pre id="result"></pre>
</p>
</form>
</body>
</html>
规范
Specification |
---|
DOM Standard # dom-element-attributes |
浏览器兼容性
BCD tables only load in the browser
参见
NamedNodeMap
,返回对象的接口- 跨浏览器兼容性问题可参考:quirksmode