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 相关文章推荐
jQuery EasyUI API 中文文档 - Menu菜单
Oct 03 Javascript
JS使用cookie实现DIV提示框只显示一次的方法
Nov 05 Javascript
基于Bootstrap实现图片轮播效果
May 22 Javascript
jQuery获取多种input值的简单实现方法
Jun 20 Javascript
jQuery实现点击行选中或取消CheckBox的方法
Aug 01 Javascript
js自调用匿名函数的三种写法(推荐)
Aug 19 Javascript
JS中append字符串包含onclick无效传递参数失败的解决方案
Dec 26 Javascript
基于jQuery实现的打字机效果
Jan 16 Javascript
JS判断指定dom元素是否在屏幕内的方法实例
Jan 23 Javascript
vue2单元测试环境搭建
May 24 Javascript
微信小程序使用map组件实现解析经纬度功能示例
Jan 22 Javascript
9种方法优化jQuery代码详解
Feb 04 jQuery
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中出现空白页的原因及解决方法汇总
2014/07/08 PHP
php对象和数组相互转换的方法
2015/05/12 PHP
PHP sdk实现在线打包代码示例
2020/12/09 PHP
web css实现整站样式互相切换
2013/10/29 Javascript
JS调试必备的5个debug技巧
2014/03/07 Javascript
JS实现根据当前文字选择返回被选中的文字
2014/05/21 Javascript
JavaScript中的getTimezoneOffset()方法使用详解
2015/06/10 Javascript
再JavaScript的jQuery库中编写动画效果的指南
2015/08/13 Javascript
Javascript实现商品秒杀倒计时(时间与服务器时间同步)
2015/09/16 Javascript
Jquery判断form表单数据是否变化
2016/03/30 Javascript
JavaScript判断微信浏览器实例代码
2016/06/13 Javascript
微信小程序学习(4)-系统配置app.json详解
2017/01/12 Javascript
xmlplus组件设计系列之列表(4)
2017/04/26 Javascript
vuejs手把手教你写一个完整的购物车实例代码
2017/07/06 Javascript
jQuery实现下拉菜单动态添加数据点击滑出收起其他功能
2018/06/14 jQuery
一个Vue页面的内存泄露分析详解
2018/06/25 Javascript
详解create-react-app 2.0版本如何启用装饰器语法
2018/10/23 Javascript
React+TypeScript+webpack4多入口配置详解
2019/08/08 Javascript
layui.use模块外部使用其内部定义的js封装函数方法
2019/09/16 Javascript
python中__call__内置函数用法实例
2015/06/04 Python
Python 读取图片文件为矩阵和保存矩阵为图片的方法
2018/04/27 Python
python装饰器原理与用法深入详解
2019/12/19 Python
Tensorflow的常用矩阵生成方式
2020/01/04 Python
Python @property原理解析和用法实例
2020/02/11 Python
python源文件的字符编码知识点详解
2021/03/04 Python
联想墨西哥官方网站:Lenovo墨西哥
2016/08/17 全球购物
创业计划书怎样才能打动风投
2014/01/01 职场文书
党员公开承诺践诺书
2014/03/25 职场文书
关于雷锋的演讲稿
2014/05/10 职场文书
优秀电子工程系毕业生求职信
2014/05/24 职场文书
租房协议书
2014/09/12 职场文书
大学军训自我鉴定大全
2014/09/18 职场文书
医院党的群众路线教育实践活动领导班子对照检查材料
2014/09/25 职场文书
个人工作违纪检讨书
2015/05/05 职场文书
社区法制宣传日活动总结
2015/05/05 职场文书
《云雀的心愿》教学反思
2016/02/23 职场文书