本节内容:
getElementsByName的用法实例
实例1:
实例2:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>getElementsByName2[拿到name是pr的p标签对象数组]-www.jb200.com</title>
</head>
<body >
<p name="pr" ff="pr"> aaa </p>
<p name="pr" ff="pr"> bbb </p>
<p name="pr" ff="pr"> ccc </p>
<p name="pr" ff="pr"> ddd </p>
<p name="pr" ff="pr"> eee </p>
<p name="pr" > eee </p>
<p name="pr" > eee </p>
<p name="pr" > eee </p>
<input type="button" onclick="myFun()" value="按钮"/>
</body>
<script type="text/javascript">
var getElementsByName = function(name){
var rets = document.getElementsByName(name);
if(rets.length == 0) {
rets = [];
var alls = document.getElementsByTagName_r("*");
for(var i=0;i<alls.length ; i++) {
if(alls[i].getAttribute("name") == name) {
rets.push(alls[i]);
}
}
}
return rets;
};
function myFun() {
var res = getElementsByName("pr");
alert(res.length);
}
</script>
</html>
定义和用法
getElementsByName() 方法可返回带有指定名称的对象的集合。
语法document.getElementsByName(name)
该方法与 getElementById() 方法相似,但是它查询元素的 name 属性,而不是 id 属性。
另外,因为一个文档中的 name 属性可能不唯一(如 HTML 表单中的单选按钮通常具有相同的 name 属性),所有 getElementsByName() 方法返回的是元素的数组,而不是一个元素。
例子:
<html>
<head>
<script type="text/javascript">
function getElements() {
var x=document.getElementsByName("myInput");
alert(x.length);
}
</script>
</head>
<body>
<input name="myInput" type="text" size="20" /><br />
<input name="myInput" type="text" size="20" /><br />
<input name="myInput" type="text" size="20" /><br /><br />
<input type="button" onclick="getElements()"value="How many elements named 'myInput'?" />
</body>
</html>
说明:
getElementById,它也是只有document对象才能使用,而且返回的是数组的第一个元素,它的方法名都写明了是getElement而不是getElements。
因此,不要搞浑了.getElementsByName返回的是所有name为指定值的所有元素的集合。
“根据 NAME 标签属性的值获取对象的集合。”集合比数组要松散的多,集合里每个子项的类型可以不同,集合只是把某些元素放在一起作为一类来使用,相比之下数组就严格多了,每个子项都是统一的类型。
document.getElementsByName、document.getElementsByTagName、document.formName.elements 这类方法所得到的结果都是集合。
用于批量更新时的数据传递。