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
广告