js之DOM元素遍历
对于元素间的空格,IE9之前的版本不会返回文本节点,而且他所有浏览器都会返回文本节点。这样就导致
使用childNodes和firstChild等属性时的行为不一致。从而有了Element Traversal API 为DOM元素添加额以下5个元素:
chaildElementCount:返回子元素(不包括文本节点和注释)的个数
firstElementChild:指向第一个子元素
lastElementChild:指向最后一个子元素
previousElementSilbing:指向前一个同辈元素
nextElementSibling:指向后一个同辈元素
下面来看一个例子:过去,要跨浏览器遍历某个元素的所有子元素,需要下面的代码:
var i,len,child = element.firstChild;
while(child!=element.lastChild){
if(child.nodeType == 1){ //检查是不是元素类型
...
}
child = child.nextSibling;
}
而现在使用Element Traversal新增元素,可以这样:
var i,len,child = element.firstElementChild;
while(child!=element.lastElementChild){
.....
child = child.nextSibling;
}
js之DOM元素遍历的更多相关文章
- JS1 js获取dom元素方法
js获取dom元素方法 1.通过ID选取元素(getElementById) 1)使用方法:document.getElementById("domId") 其 ...
- 关于Echarts的原生js获取DOM元素与动态加载DOM元素的冲突问题
1.前言: 最近在做的看板项目,因为需要循环加载后台数据,并且用Echarts做数据呈现,所以jQuery和angular等库统统靠边站,Echarts用的是原生js获取DOM元素,至于诸多不兼容等深 ...
- Js为Dom元素绑定事件须知
为异步加载的Dom 元素绑定事件必须在加载完成之后绑定: $('body').load('LearnClickBinding.ashx');$('a').click(function () { ale ...
- JS获取DOM元素的八种方法
JS获取DOM元素的方法(8种) 通过ID获取(getElementById) 通过name属性(getElementsByName) 通过标签名(getElementsByTagName) 通过类名 ...
- JS操作DOM元素属性和方法
Dom元素基本操作方法API,先记录下,方便以后使用. W3C DOM和JavaScript很容易混淆不清.DOM是面向HTML和XML文档的API,为文档提供了结构化表示,并定义了如何通过脚本来访 ...
- 详解JS中DOM 元素的 attribute 和 property 属性
一.'表亲戚':attribute和property 为什么称attribute和property为'表亲戚'呢?因为他们既有共同处,也有不同点. attribute 是 dom 元素在文档中作为 h ...
- JS复制DOM元素文字内容
要实现的效果:将HTML页面中的某个DOM元素例如DIV下面的文本内容进行复制. 实现过程如下: <html> <head> <title>Copy text De ...
- JS选取DOM元素的方法
摘自JavaScript权威指南(jQuery根据样式选择器查找元素的终极方式是 先用getElementsByTagName(*)获取所有DOM元素,然后根据样式选择器对所有DOM元素进行筛选) 今 ...
- js获取dom元素的子元素,父元素,兄弟元素小记
原生jsvar a = document.getElementById("dom"); del_space(a); //清理空格 var b = a.childNodes; //获 ...
随机推荐
- C++.【转】C++数值类型与string的相互转换
1.C++数值类型与string的相互转换 - JohnGu - 博客园.html(https://www.cnblogs.com/johngu/p/7878029.html) 2. 1.数值类型转换 ...
- C#发起HTTP请求
浏览器能看到的数据 用后端模拟请求都能获取到 如果拿不到 看看是不是请求参数哪里没设置 刚好服务器检查了这个参数 string url = ""; string para = ...
- Android主页Activity对多个Fragment实现不同的沉浸式标题(图片或者文字标题)
提示:讲解的该例实现是 FragmentTabHost + Fragment 实现: 1.示例效果图: 2.场景需求: 如示例图所示,在首页实现轮播图的沉浸,而 “发现” 和“我的”页是标题的沉浸. ...
- Linux性能测试-FIO测试
Fdisk –l 查看磁盘分区情况. df –h 磁盘挂载情况 wget http://brick.kernel.dk/snaps/fio-2.2.5.tar.gz yum install liba ...
- 算法笔记--斜率优化dp
斜率优化是单调队列优化的推广 用单调队列维护递增的斜率 参考:https://www.cnblogs.com/ka200812/archive/2012/08/03/2621345.html 以例1举 ...
- 神兽保佑代码无bug O(∩_∩)O
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>& ...
- 使用“rz -be”命令上传文件至服务器;使用“sz 文件名”从服务器下载文件到本地
注意:需要事先安装lrzsz服务 yum install -y lrzsz 因为服务器没有安装sftp服务,无法使用FileZilla.Xftp等连接服务器上传文件,这种情况可以利用rz命令上传文件. ...
- js时间戳如何转时间
js时间戳如何转时间 一.总结 一句话总结:Date对象分别获取年now.getFullYear()月now.getMonth()+1日now.getDate()即可 Date对象分别获取年now.g ...
- app和bootloader跳转 MSP与PSP
1.不要把跳转函数放在中断中,如此导致在跳转后的app或者bootloder都是在中断状态,只要你一开启该中断,就可能出现硬件中断了 2.如果你的APP使用了ucos系统,在跳转函数中还需要增加__s ...
- docker 安装完mysql 后客户端无法访问
1.在虚拟机的centos 中安装 docker 的mysql 镜像. docker run --name mysql01 -p 3306:3306 -e MYSQL_ROOT_PASSWORD=12 ...