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对表单的操作代码集合
Apr 06 Javascript
JavaScript自动设置IFrame高度的小例子
Jun 08 Javascript
使用npm发布Node.JS程序包教程
Mar 02 Javascript
简介JavaScript中的push()方法的使用
Jun 09 Javascript
值得分享和收藏的Bootstrap学习教程
May 12 Javascript
基于node.js之调试器详解
Aug 22 Javascript
使用JS判断移动端手机横竖屏状态
Jul 30 Javascript
JavaScript闭包原理与用法实例分析
Aug 10 Javascript
Jquery获取radio选中值实例总结
Jan 17 jQuery
angular多语言配置详解
May 16 Javascript
vue获取data数据改变前后的值方法
Nov 07 Javascript
Vue如何实现验证码输入交互
Dec 07 Vue.js
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采用超长(超大)数字运算防止数字以科学计数法显示的方法
2016/04/01 PHP
laravel框架邮箱认证实现方法详解
2019/11/22 PHP
扩展String功能方法
2006/09/22 Javascript
jQuery+slidereveal实现的面板滑动侧边展出效果
2015/03/14 Javascript
js下拉选择框与输入框联动实现添加选中值到输入框的方法
2015/08/17 Javascript
jQuery 1.9.1源码分析系列(十五)之动画处理
2015/12/03 Javascript
直接拿来用的页面跳转进度条JS实现
2016/01/06 Javascript
JavaScript中对JSON对象的基本操作示例
2016/05/21 Javascript
很实用的js选项卡切换效果
2016/08/12 Javascript
完全深入学习Bootstrap表单
2016/11/28 Javascript
使用vue.js2.0 + ElementUI开发后台管理系统详细教程(一)
2017/01/21 Javascript
JS实现仿饿了么在浏览器标签页失去焦点时网页Title改变
2017/06/01 Javascript
微信小程序实现图片预览功能
2018/01/31 Javascript
移动端如何用下拉刷新的方式实现上拉加载
2018/12/10 Javascript
说说如何利用 Node.js 代理解决跨域问题
2019/04/22 Javascript
Vue可自定义tab组件用法实例
2019/10/24 Javascript
Vue数据双向绑定底层实现原理
2019/11/22 Javascript
跟老齐学Python之编写类之一创建实例
2014/10/11 Python
Python实现扣除个人税后的工资计算器示例
2018/03/26 Python
python3+PyQt5 实现Rich文本的行编辑方法
2019/06/17 Python
python中通过selenium简单操作及元素定位知识点总结
2019/09/10 Python
python二维图制作的实例代码
2020/12/03 Python
Expedia爱尔兰:酒店、机票、租车及廉价假期
2017/01/02 全球购物
俄罗斯在线手表和珠宝商店:AllTime
2019/09/28 全球购物
韩国乐天网上商城:Lotte iMall
2021/02/03 全球购物
PHP如何防止SQL注入
2014/05/03 面试题
linux面试题参考答案(8)
2016/04/19 面试题
编辑硕士自荐信范文
2013/11/27 职场文书
关于祖国的演讲稿
2014/05/04 职场文书
员工合理化建议书
2014/05/19 职场文书
2014年党员自我剖析材料
2014/10/07 职场文书
计划生育证明格式及范本
2014/10/09 职场文书
国际贸易实务实训报告
2014/11/05 职场文书
2019年思想汇报
2019/06/20 职场文书
python tkinter模块的简单使用
2021/04/07 Python
Python中else的三种使用场景
2021/06/16 Python