HTML - DOM HTMLCollection namedItem() 方法



HTML DOM HTMLCollection **namedItem()** 方法用于获取集合中第一个 ID 或名称与 namedItem() 方法参数中提到的名称匹配的元素。

语法

HTMLCollection[name];
Or
HTMLCollection.namedItem(name);

参数

它接受一个必需参数,如下所示。

参数 描述
name 它表示您想要返回的元素的 ID 或名称属性。

返回值

它返回与参数中提到的 ID 或名称属性对应的元素。

HTML DOM HTMLCollection 'namedItem()' 方法示例

以下示例说明了 namedItem() 方法的使用。

获取 script 元素的内容

以下示例返回 ID 为 "s3" 的 script 元素的内容

<!DOCTYPE html>
<html lang="en">
<head>
    <title>HTMLCollection namedItem() Method</title>
</head>
<body>
    <script>document.getElementById("s1").innerHTML = "This is first Script."</script>
    <script>document.getElementById("s2").innerHTML = "This is second Script."</script>
    <script id="last">document.getElementById("s3").innerHTML = "This is third Script."</script>
    <p>Click to get content of script element with id= 's3'.</p>
    <button onclick="fun()">Click me</button>
    <p id="s1"></p>
    <p id="s2"></p>
    <p id="s3"></p>
    <p id="scripts"></p>
    <script>
        function fun() {
            let x = document.scripts.namedItem("last").text;
            document.getElementById("scripts").innerHTML = x;
        }
    </script>
</body>
</html>

获取元素内容的另一种方法。

以下示例说明了获取 ID 为 "alt" 的 <h1> 元素内容的另一种方法

<!DOCTYPE html>
<html lang="en">
<head>
    <title>HTMLCollection namedItem() Method</title>
</head>
<body>
    <h1 id="alt">I am h1 with alt id</h1>
    <h2>I am random text</h2>
    <p>Click to get content of h1 element with id= 'alt'.</p>
    <button onclick="fun()">Click me</button>
    <p id="display"></p>
    <script>
        function fun() {
            let x = document.getElementsByTagName("h1");
            let y = x["alt"];
            document.getElementById("display").innerHTML = y.innerHTML;
        }
    </script>
</body>
</html>

获取 button 元素的内容

以下示例返回 **name="fun"** 的 button 元素的内容。

<!DOCTYPE html>
<html lang="en">
<head>
    <title>HTMLCollection namedItem() Method</title>
</head>
<body>
    <p>Click on "click me" to get content of button element with name= 'fun'.</p>
    <button onclick="fun()">Click me</button>
    <button name="fun">Button 1</button>
    <p id="display"></p>
    <script>
        function fun() {
            let x = document.getElementsByTagName("button").namedItem("fun").innerHTML;
            //let y=x["alt"];
            document.getElementById("display").innerHTML = x;
        }
    </script>
</body>
</html>

支持的浏览器

方法 Chrome Edge Firefox Safari Opera
namedItem() 是 1 是 12 是 1 是 1 是 12.1
广告