js中通过getElementsByName访问name集合对象的方法

获取name集合对象是DOM中的常见操作之一，使用getElementsByName方法可以获取到相应名字的元素节点集合。下面为大家提供选定属性值的两条示例说明：

语法说明

getElementsByName方法通过指定元素的name特定属性来获取文档中具有相同name属性值的元素集合。其基本语法如下：

var elements = document.getElementsByName(name)

其中，name为指定的name特定属性值。

示例说明

示例1

通过getElementsByName访问name集合，选取name值为"username"的所有元素，并将它们的文本内容修改为"John Doe"。

<input type="text" name="username" value="Alice">  
<input type="text" name="username" value="Bob">  
<input type="text" name="email" value="[e-mail]">  
<input type="text" name="email" value="[e-mail]"> 

//获取name值为"username"的所有元素
var elements = document.getElementsByName("username");

//遍历所有元素
for (var i = 0; i < elements.length; i++) {
    //修改元素的文本内容为"John Doe"
    elements[i].value = "John Doe";
}

示例2

通过getElementsByName访问name集合，选取name值为"email"的所有元素，并将它们的背景颜色修改为红色。

<input type="text" name="username" value="Alice">  
<input type="text" name="username" value="Bob">  
<input type="text" name="email" value="[e-mail]">  
<input type="text" name="email" value="[e-mail]"> 

//获取name值为"email"的所有元素
var elements = document.getElementsByName("email");

//遍历所有元素
for (var i = 0; i < elements.length; i++) {
    //修改元素的背景颜色为红色
    elements[i].style.backgroundColor = "red";
}

以上就是通过getElementsByName方法访问name集合对象的方法攻略。