如何使用nodeName属性检索属性的名称？

Question

您可以使用nodeName轻松地检索元素的标记名，如下所示：

​

var atnode = document.getElementById("link-test");
alert(atnode.nodeName);

<a href="#" id="link-test">link</a>

​

但是如何使用nodeName来获取元素的属性呢？

使用getAttribute()并不能做我想做的事情，因为您必须先插入属性的名称，然后它只返回属性值。我想得到属性的名称，就像我对nodeName所做的那样。我知道nodeName也可以用于属性节点，但是如何使用呢？

Answer 1

您可以在节点上获得带有getAttributeNames()的属性列表。在您的示例中，您可以这样做：

atnode.getAttributeNames()，这将返回["href", "id"]。

然后，您可以使用getAttribute(<item from list as string>)循环遍历列表，以获取元素的属性值。

Answer 2

​

const atnode = document.getElementById("link-test");
const nodes=[];
const values=[];

for (let att, i = 0, atts = atnode.attributes, n = atts.length; i < n; i++){
    att = atts[i];
    nodes.push(att.nodeName);
    values.push(att.nodeValue);
    console.log(att.nodeName + " - " + att.nodeValue);
}

<a href="#" id="link-test">link</a>

​

在使用属性方法之后，可以使用nodeName获取属性名，使用nodeValue获取属性值。将其推送到数组后，可以在两个数组中使用相同的索引获取属性和值。

Answer 3

如果我理解得对，您只需使用getAttributeNames方法即可。

以下是一个例子：

​

const exampleElement = document.getElementsByTagName("example")[0];
console.log(exampleElement.getAttributeNames());

<example name="one" last="two"></example>

​