【DOM学习】nextSibling节点的用法

来源:互联网 发布:8.1号后淘宝买药流程 编辑:程序博客网 时间:2024/06/05 20:02
<!DOCTYPE html><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /></head><body><ol id="list"><li id="one">one</li><li id="two">two</li><li id="three">three</li><li id="four">four</li><li id="five">five</li></ol><input type="button" value="上一个" onclick="change(curTarget.previousSibling.previousSibling);"/>
<script type="text/javascript">var curTarget = document.getElementById("three");var change = function(target){alert(target.innerHTML);}</script></body></html>

这是要求第三个(three)节点的前一个兄弟节点(two)的用法,很奇怪为什么代码里面用到的两次previousSibling,那不就是one了嘛?

果然是我想当然了,原来<ol>标签的子节点不只是5个,每两个<li>之间有空格和换行。。。。,必须向上处理两个node才行,查资料以后发现只有IE会支持不留空白,就是向上一个节点,很神奇啊。。。。

0 0