HTML - DOM 文件 getElementsByName() 方法



HTML DOM 文件 getElementsByName() 方法用於返回具有引數中指定的 name 屬性的元素集合。

語法

document.getElementsByName(name);

引數

此方法接受如下所示的單個引數。

引數 描述
name 它代表元素的 name 屬性。

返回值

它返回一個 NodeList 物件,該物件是引數中給定名稱指定的所有元素的集合。

HTML DOM 文件 'getElementsByName()' 方法示例

下面是說明 getElementsByName() 方法用法的示例。

統計元素數量

在下面的示例中,此方法用於統計 name = "apps" 的元素數量。

<!DOCTYPE html>
<html lang="en">
<head>
    <title>
        HTML DOM document getElementsByName() Method
    </title>
</head>
<body>
    <button onclick="fun()">Click me</button><br>
    <input type="text" name="apps" value="Tutorial Point">
    <input type="text" name="apps" value="Tutorix">
    <input type="text" name="game" value="TOD">
    <p id="type"></p>
    <script>
        function fun() {
            let x = document.getElementsByName("apps").length;
            document.getElementById("type").innerHTML =
                "Elements with name 'apps' :" + x;
        }
    </script>
</body>
</html>

獲取標籤名稱

在下面的示例中,此方法用於獲取 name="forms" 元素的標籤名稱。

<!DOCTYPE html>
<html lang="en">
<head>
    <title>
        HTML DOM document getElementsByName() Method
    </title>
</head>
<body>
    <button onclick="fun()">Click me</button><br>
    <form name="form">
        <input type="text" name="apps" value="Tutorial Point">
        <input type="text" name="game" value="TOD">
    </form>
    <p id="type"></p>
    <script>
        function fun() {
            let x = document.getElementsByName("form")[0].tagName;
            document.getElementById("type").innerHTML =
                "Elements with name 'forms' :" + x;
        }
    </script>
</body>
</html>

獲取元素內容

在下面的示例中,此方法用於獲取 name="form1" 的內容。

<!DOCTYPE html>
<html lang="en">
<head>
    <title>
        HTML DOM document getElementsByName() Method
    </title>
</head>
<body>
    <button onclick="fun()">Click me</button><br>
    <form name="form1">
        <input type="text" name="random" value="This is form 1">
        <input type="text" name="apps" value="Tutorial Point">
        <input type="text" name="game" value="TOD">
    </form>
    <br><br>
    <form name="form2">
        <input type="text" name="randoms" value="This is form 2">
        <input type="text" name="apps" value="Tutorix">
        <input type="text" name="game" value="RoadRash">
    </form>
    <p id="type"></p>
    <script>
        function fun() {
            let x = document.getElementsByName("form1")[0].innerHTML;
            document.getElementById("type").innerHTML =
                "Content of the elements with name 'form1' :" + x;
        }
    </script>
</body>
</html>

支援的瀏覽器

方法 Chrome Edge Firefox Safari Opera
getElementsByName() 是 1 是 12 是 1 是 1 是 5
html_dom_document_reference.htm
廣告