HTML - DOM 属性名称属性

HTML DOM 属性 name 属性用于获取元素上使用属性的名称。name 属性是只读属性，这意味着此属性无法更改 HTML 元素的属性。

语法

attribute.name

返回值

name 属性返回指定索引的属性名称。

HTML DOM 属性“name”属性示例

以下是一些示例代码，说明如何在 JavaScript 和 HTML 中使用“name”属性。

获取第一个属性的名称

以下代码演示如何使用 name 属性获取 HTML 标签属性的名称。

<!DOCTYPE html>
<html>

<head>
    <title>HTML DOM Attribute name Property</title>
</head>

<body>
    <h3>HTML DOM Attribute name Property</h3>
    <p>
        The name property of DOM returns 
        the name of an attribute
    </p>

    <div id="demo"></div>

    <script>
        const element = document.getElementById("demo");

        // This will select name of first attribute of div
        let aName = element.attributes[0].name;
        // Pass the name to inside of div tag
        document.getElementById("demo").innerHTML = aName;
    </script>
</body>

</html>

获取所有属性的名称

在这里，我们将运行一个简单的 for 循环来获取 HTML 元素的所有属性的名称。

<!DOCTYPE html>
<html>

<head>
    <title>HTML DOM Attribute name Property</title>
</head>

<body>
    <h3>HTML DOM Attribute name Property</h3>
    <p>
        The name property of DOM returns 
        the name of attributes
    </p>

    <div id="demo" 
         class="exampleClass" 
         data-info="someData">
    </div>

    <script>
        const element = document.getElementById("demo");

        // Initialize an empty array to hold attribute names
        let attributeNames = [];

        // Loop through all attributes of the element
        for (let i = 0; i < element.attributes.length; i++) {
            attributeNames.push(element.attributes[i].name);
        }

        // Join the attribute names with commas 
        // and pass them inside the div tag
        document.getElementById("demo").innerHTML = 
        attributeNames.join(", ");
    </script>

</body>

</html>

支持的浏览器

属性
name	是	是	是	是	是

打印页面