nextSibling 和nextElementSibling
在使用DOM过程中发现一个问题:
使用nextSibling 属性返回指定节点之后紧跟的节点,在相同的树层级中。被返回的节点以 Node 对象返回。
this.arrow = this.screen.nextSibling;
this.left = this.arrow.children[0]; // undefined
this.right = this.arrow.children[1]; // undefined // 使用nextElementSibling
this.arrow = this.screen.nextElementSibling;
this.left = this.arrow.children[0]; // 正常获取第一个子节点
this.right = this.arrow.children[1]; // 正常获取第2个子节点
nextSibling属性与nextElementSibling属性的差别:
nextSibling属性返回元素节点之后紧跟的兄弟节点(包括文本节点、注释节点即回车、换行、空格、文本等等);
nextElementSibling属性只返回元素节点之后紧跟的兄弟元素节点(不包括文本节点、注释节点);
注意: 空格、回车也会看作文本,以文本节点对待。
nextSibling 和nextElementSibling的更多相关文章
- nextSibling VS nextElementSibling
2. nextSibling vs nextElementSibling { //FF { 在Firefox中,link2的nextSibling并不是link3,因为两者之间有一个换行符. 这被认为 ...
- 【踩坑】nextSibling 和nextElementSibling的区别
DOM 使用nextSibling属性返回指定节点之后的下一个兄弟节点,(即:相同节点树层中的下一个节点). nextSibling属性与nextElementSibling属性的差别: nextSi ...
- 兼容的firstChild,lastChild,nextSibling,previousSibling写法
在IE下是支持firstChild,lastChild,nextSibling,previousSibling 但是在FF下,由于它会把标签之间的空格当成文本节点,所以为了准确地找到相应的元素,会用 ...
- 05.DOM
DOM基础 什么是DOM 标签元素节点浏览器支持情况 火狐支持最好 谷歌其次 ie最差 尤其是ie6-8DOM节点节点分为:元素节点和文本节点 测试节点的类型用nodeTypenodeType 为3 ...
- DOM相关属性,方法,兼容性问题处理小析
DOM:Document Object Model文档对象模型,用于让程序(js)取操作页面中的元素.DOM节点类型有12种. (一)属性 一.子节点操作1.所有子节点(1)元素.childNodes ...
- JavaScript 基础第八天(DOM第二天)
一.引言 初步认识DOM有可能会被各种不熟悉的因为因素影响自己的学习心态,你需要的是多去记忆一些单词然后加强自己的代码量. 二.导入 在昨天初步认识DOM以后我们见天将接着介绍有关于DOM的内容. 三 ...
- js DOM Element属性和方法整理
节点操作,属性 1. childNodes.children 这两个属性获取到的子节点会根据浏览器的不同而不同的,所以一定要判断下nodeType是否为1. childNodes获取到的是NodeLi ...
- javascript基础07
javascript基础07 1.节点 元素.childNodes : 属性 只读 属性 子节点列表集合 元素.childNodes 只包含子节点,不包含孙节点 DOM节点的类型有很多种,w3c标准有 ...
- Dom初
DOM基础 •什么是DOM •浏览器支持情况 lDOM节点 •childNodes nodeType –获取子节点 <!DOCTYPE html PUBLIC "-//W3C//DT ...
随机推荐
- poj3352 边-双联通分量
题意:给一个无向图,问最少加几条边变成边-双联通 题解:求一次双联通,缩点,这样就变成了一棵树,结果就是(树上的叶子节点+1)/2,叶子节点可以通过入度判断 #include<map> # ...
- 如何在MySQL中查询当前数据上一条和下一条的记录
如果ID是主键或者有索引,可以直接查找: 方法一: 查询上一条记录的SQL语句(如果有其他的查询条件记得加上other_conditions以免出现不必要的错误): select * from tab ...
- PPAS数据库备份与恢复
PPAS数据库备份不同于普通的Postgresql数据库的备份,因为PPAS数据库是兼容Oracle数据库的,所以会涉及到同义词.包.存储过程等,这个时候用Postgresql社区的备份与恢复工具时, ...
- 8th
2017-2018-2 20179212<网络攻防实践>第8周作业 视频学习 Kali权限维持之后门 权限维持包含Tunnel工具集.Web后门.系统后门三个子类.其中系统后门与web后门 ...
- 【C/C++】assert
摘自http://www.cplusplus.com assert : macro #include <assert.h> void assert (int expression); 如果 ...
- 常用排序算法总结(C语言描述)
最近又把排序给复(yu)习(xi)了一遍,在此总结一下~具体理论思想持续补充完善中... 1.交换排序 (1)普通冒泡 时间复杂度:最差.平均都是O(n^2),最好是O(n) 空间复杂度:O(1) # ...
- 【转】 Pro Android学习笔记(六一):Preferences(5):组织Preference
目录(?)[-] PreferenceCategory Child Preference PreferenceCategory 如果有多个preference,我们希望能在他们组织在一起.有两种方式, ...
- nginx中给目录增加密码保护实现程序
一款nginx中给目录增加密码保护实现程序,可以有效的保护一些目录不被访问,有需要的朋友可参考一下. 了防止一些可能出现存在漏洞的后台脚本暴露,使用验证的方式保护这些文件所在的目录 使用apache的 ...
- 多校联合训练&hdu5791 Two
hdu5791 dp[i][j]表示的是序列A前i个数字和序列B前j个数字的公共子序列的总个数,那么的dp公式就可以这么表示 理解一下此公式若最尾部的a[i]和b[j]相等的话,那么单独的a[i]和b ...
- Android ANR原因以及开发时如何预防
经常可以在Android系统上发现ANR异常响应的问题.故了解一下ANR出现的原因 一. Android系统中,应用程序的响应是由ActivityManager 和 WindowManger系统服务监 ...