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实现异步刷新的代码(转载)
Mar 29 Javascript
在表单提交前进行验证的几种方式整理
Jul 31 Javascript
文本框只能选择数据到文本框禁止手动输入
Nov 22 Javascript
JS批量操作CSS属性详细解析
Dec 16 Javascript
js触发select onchange事件的小技巧
Aug 05 Javascript
jQuery.position()方法获取不到值的安全替换方法
Mar 13 Javascript
jQuery+vue.js实现的九宫格拼图游戏完整实例【附源码下载】
Sep 12 jQuery
Koa项目搭建过程详细记录
Apr 12 Javascript
vue环形进度条组件实例应用
Oct 10 Javascript
函数式编程入门实践(一)
Apr 20 Javascript
Ajax实现三级联动效果
Oct 05 Javascript
vue如何清除浏览器历史栈
May 25 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学习之输出字符串(echo,print,printf,print_r和var_dump)
2011/04/17 PHP
解析link_mysql的php版
2013/06/30 PHP
PHP 关于访问控制的和运算符优先级介绍
2013/07/08 PHP
PHP 验证身份证是否合法的函数
2017/02/09 PHP
javascript中String类的subString()方法和slice()方法
2011/05/24 Javascript
jquery触发a标签跳转事件示例代码
2013/07/21 Javascript
javascript删除数组元素并且数组长度减小的简单实例
2014/02/14 Javascript
jQuery实现动态表单验证时文本框抖动效果完整实例
2015/08/21 Javascript
Jquery插件之Fancybox丰富的弹出层效果附源码下载
2015/12/02 Javascript
Vue.js实现表格动态增加删除的方法(附源码下载)
2017/01/20 Javascript
Nodejs中使用captchapng模块生成图片验证码
2017/05/18 NodeJs
详解从Vue.js源码看异步更新DOM策略及nextTick
2017/10/11 Javascript
浅谈Webpack下多环境配置的思路
2018/06/27 Javascript
JavaScript常见鼠标事件与用法分析
2019/01/03 Javascript
JavaScript动态创建二维数组的方法示例
2019/02/01 Javascript
JavaScript判断浏览器版本的方法
2019/11/03 Javascript
node.js中stream流中可读流和可写流的实现与使用方法实例分析
2020/02/13 Javascript
jquery实现上传文件进度条
2020/03/26 jQuery
在Vue里如何把网页的数据导出到Excel的方法
2020/09/30 Javascript
jQuery实现电梯导航模块
2020/12/22 jQuery
Python机器学习logistic回归代码解析
2018/01/17 Python
python如何为创建大量实例节省内存
2018/03/20 Python
PyQt4实现下拉菜单可供选择并打印出来
2018/04/20 Python
使用Python的Dataframe取两列时间值相差一年的所有行方法
2018/07/10 Python
在Pycharm中将pyinstaller加入External Tools的方法
2019/01/16 Python
python获取指定日期范围内的每一天,每个月,每季度的方法
2019/08/08 Python
keras处理欠拟合和过拟合的实例讲解
2020/05/25 Python
Python devel安装失败问题解决方案
2020/06/09 Python
Django中Q查询及Q()对象 F查询及F()对象用法
2020/07/09 Python
今天学到的CSS最新技术(与图片背景相关)
2012/12/24 HTML / CSS
Html5实现用户注册自动校验功能实例代码
2016/05/24 HTML / CSS
uniapp+Html5端实现PC端适配
2020/07/15 HTML / CSS
阿迪达斯英国官方网站:adidas英国
2019/08/13 全球购物
施工人员岗位职责
2013/12/12 职场文书
意向协议书范本
2014/04/23 职场文书
师德师风整改措施
2014/10/24 职场文书