Document:getElementsByName()使用方法及示例
更新时间：2013年10月28日 15:29:10 作者：
Document:getElementsByName()想必大家对它并不陌生吧，主要是根据名称获取元素，下面是其具体的使用方法及范例，感兴趣的朋友不要错过
定义和用法
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 这类方法所得到的结果都是集合.用于批量更新时的数据传递.
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 这类方法所得到的结果都是集合.用于批量更新时的数据传递.
相关文章
这篇文章主要为大家详细介绍了JavaScript实现时间范围效果，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2021-05-05
这篇文章主要介绍了如何利用Cesium实现绘制圆形、正方形、多边形、椭圆等形状的图形标注，文中的示例代码讲解详细，需要的可以参考一下2022-06-06
jsonp 全称是JSON with Padding，是为了解决跨域请求资源而产生的解决方案。下面让我们了解一下是如何使用的吧。2013-10-10
如何在javascript 中使用 xmlHttpRequest 发送 POST
本文将通过不同的示例解释如何使用JavaScript代码在AJAX编程中发送 XMLHttpRequest post 请求，本文通过实例代码给大家介绍的非常详细，对大家的学习或工作具有一定的参考借鉴价值，需要的朋友参考下吧2023-07-07
JavaScript前端中的伪类元素before和after使用详解
before和after也算是css里面最常见的元素了，而我却一直不太了解，再不学一下就真的太不像话了。所以学习一下，需要的朋友们下面随着小编来一起学习吧2023-02-02
本篇文章主要介绍了redux中间件之redux-thunk的具体使用，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2018-04-04
本篇文章将会讲解原生JavaScript如何实现简单的AJAX，还有跨域请求JSONP。具有很好的参考价值。下面跟着小编一起来看下吧2017-02-02
为了兼容各种浏览器，今天没事特意复习了一下js原生事件特性，对其封装一下。2013-04-04
这篇文章主要介绍了js实现按钮控制图片360度翻转特效的方法,涉及HTML5中canvas方法的使用技巧,具有一定参考借鉴价值,需要的朋友可以参考下2015-02-02
比较数组中数值的大小是比较常见的操作，下面同本文给大家分享四种放哪广发获取数组中最大值和最小值，对此感兴趣的朋友一起学习吧2016-01-01
最新评论