javascript核心技术（二十二）DOM--查找节点(四) 通过name属性值获取页面元素

人亦已歌 · 发表于 2023-1-24 14:17:31

通过name属性值获取页面元素，返回一个NodeList节点列表，是一个类数组的特殊对象。可以直接当作数组使用。
NodeList节点列表里面每一个元素，是具体的一个标签。
请看以下代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>通过name属性值获取页面元素</title>
</head>
<body>
    <div id="div1" class="div100 div300">div1</div>
    <div id="div1" class="div11 div33">div111</div>
    <div id="div2" class="div100">div2</div>
    <div id="div3" class="div200">div3</div>
    <div id="div4" class="div200">div4</div>

    <input type="button" name="" value="按钮" id="btn">
    姓名：<input type="text" name="username" value="" id="username">
    密码：<input type="password" name="password" value="" id="password">
    性别：<input type="radio" name="sex" value="" id="nan">男
    <input type="radio" name="sex" value="" id="nv">女
</body>
<script>
           var divs = document.getElementsByClassName('div100');
        var inputs = document.getElementsByName('sex');
        console.log(inputs);
    console.log(inputs[0]);
</script>
</html>