javascript getElementsByTagName


Posted in Javascript onJanuary 31, 2011
function getElementsByTagName(node, tagName) { 
var elements = [], i = 0, anyTag = tagName === "*", next = node.firstChild; 
while ((node = next)) { 
if (anyTag ? node.nodeType === 1 : node.nodeName === tagName) elements[i++] = node; 
next = node.firstChild || node.nextSibling; 
while (!next && (node = node.parentNode)) next = node.nextSibling; 
} 
return elements; 
};

定义和用法
getElementsByTagName() 方法可返回带有指定标签名的对象的集合。
语法
document.getElementsByTagName(tagname)
说明
getElementsByTagName() 方法返回元素的顺序是它们在文档中的顺序。
如果把特殊字符串 "*" 传递给 getElementsByTagName() 方法,它将返回文档中所有元素的列表,元素排列的顺序就是它们在文档中的顺序。
提示和注释
注释:传递给 getElementsByTagName() 方法的字符串可以不区分大小写。
实例
例子 1
<html> 
<head> 
<script type="text/javascript"> 
function getElements() 
{ 
var x=document.getElementsByTagName("input"); 
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 input elements?" /> 
</body> 
</html>

例子 2
可以用 getElementsByTagName() 方法获取任何类型的 HTML 元素的列表。例如,下面的代码可获取文档中所有的表:
var tables = document.getElementsByTagName("table"); 
alert ("This document contains " + tables.length + " tables");

例子 3
如果您非常了解文档的结构,也可以使用 getElementsByTagName() 方法获取文档中的一个特定的元素。例如,下面的代码可以获得文档中的第四个段落:
var myParagragh = document.getElementsByTagName("p")[3];
不过,我们还是认为,如果您需要操作某个特定的元素,使用 getElementById() 方法将更为有效。
Javascript 相关文章推荐
关于Ext中form移除textfield方法:hide(),setVisible(false),remove()
Dec 02 Javascript
基于mootools 1.3框架下的图片滑动效果代码
Apr 22 Javascript
jquery设置元素的readonly和disabled的写法
Sep 22 Javascript
javascript获取函数名称、函数参数、对象属性名称的代码实例
Apr 12 Javascript
Java遍历集合方法分析(实现原理、算法性能、适用场合)
Apr 25 Javascript
JS组件系列之Bootstrap table表格组件神器【终结篇】
May 10 Javascript
ES6中参数的默认值语法介绍
May 03 Javascript
bootstrap switch开关组件使用方法详解
Aug 22 Javascript
Vue.js2.0中的变化小结
Oct 24 Javascript
微信小程序页面间值传递的两种方法
Nov 26 Javascript
JS+JQuery实现无缝连接轮播图
Dec 30 jQuery
关于Js中new操作符的作用详解
Feb 21 Javascript
js对象数组按属性快速排序
Jan 31 #Javascript
javascript 节点排序 2
Jan 31 #Javascript
js自定义事件代码说明
Jan 31 #Javascript
jQuery帮助之筛选查找 children([expr])
Jan 31 #Javascript
jQuery find和children方法使用
Jan 31 #Javascript
与jquery serializeArray()一起使用的函数,主要来方便提交表单
Jan 31 #Javascript
基于jQuery实现表格数据的动态添加与统计的代码
Jan 31 #Javascript
You might like
PHP 变量的定义方法
2010/01/26 PHP
php设计模式 Composite (组合模式)
2011/06/26 PHP
php读取EXCEL文件 php excelreader读取excel文件
2012/12/06 PHP
深入php内核之php in array
2015/11/10 PHP
微信支付开发订单查询实例
2016/07/12 PHP
php实现的XML操作(读取)封装类完整实例
2017/02/23 PHP
PHP7新特性之抽象语法树(AST)带来的变化详解
2018/07/17 PHP
Prototype使用指南之range.js
2007/01/10 Javascript
javascript 24小时弹出一次的代码(利用cookies)
2009/09/03 Javascript
在chrome中window.onload事件的一些问题
2010/03/01 Javascript
js一般方法改写成面向对象方法的无限级折叠菜单示例代码
2013/07/04 Javascript
jquery fancybox ie6不显示关闭按钮的解决办法
2013/12/25 Javascript
jquery实现的仿天猫侧导航tab切换效果
2015/08/24 Javascript
jQuery Validate表单验证深入学习
2015/12/18 Javascript
JavaScript判断对象是否为数组
2015/12/22 Javascript
理解javascript中Map代替循环
2016/02/26 Javascript
对jQuary选择器的全面总结
2016/06/20 Javascript
jquery插入兄弟节点的操作方法
2016/12/07 Javascript
最常见和最有用的字符串相关的方法详解
2017/02/06 Javascript
详解webpack 热更新优化
2018/09/13 Javascript
微信小程序事件 bindtap bindinput代码实例
2019/08/26 Javascript
解决Vue watch里调用方法的坑
2020/11/07 Javascript
Python进度条的制作代码实例
2019/08/31 Python
TensorFlow实现checkpoint文件转换为pb文件
2020/02/10 Python
Python自动化操作实现图例绘制
2020/07/09 Python
python中逻辑与或(and、or)和按位与或异或(&amp;、|、^)区别
2020/08/05 Python
matplotlib之pyplot模块坐标轴标签设置使用(xlabel()、ylabel())
2021/02/22 Python
Python实现简单的2048小游戏
2021/03/01 Python
美国演唱会和体育门票购买网站:Ticketnetwork
2018/10/19 全球购物
英国顶级水晶珠宝零售商之一:Tresor Paris
2019/04/27 全球购物
银行职员思想汇报
2013/12/31 职场文书
小学生开学感言
2014/02/28 职场文书
员工入职担保书范文
2014/04/01 职场文书
辞职信的写法
2015/02/27 职场文书
观后感的写法
2015/06/19 职场文书
高二英语教学反思
2016/03/03 职场文书