<div> <p> parentNode 获取指点节点的父节点</p> </div> <script type="text/javascript"> var mynode= document.getElementById("con"); document.write(mynode.parentNode.nodeName); </script>
注意: 父节点只有一个,浏览器兼容问题,chrome、firefox等浏览器标签之间的空白也算是一个文本节点。
8.访问兄弟节点
nextSibling //可返回某个节点之后紧跟的节点(处于同一树层级中)。
语法:nodeObject.nextSibling
previousSibling //可返回某个节点之前紧跟的节点(处于同一树层级中)。
语法:nodeObject.previousSibling
eg:
<ul> <li>Coffee</li> <li>Tea</li> </ul> <p>点击按钮来获得首个项目的下一个同胞。</p> <button>试一下</button> <script> function myFunction() { var x=document.getElementById("demo"); x.innerHTML=document.getElementById("item1").nextSibling.innerHTML; } </script>
注意: 如果无此节点,则该属性返回 null。两个属性获取的是节点。Internet Explorer 会忽略节点间生成的空白文本节点(例如,换行符号),而其它浏览器不会忽略。
解决问题方法:判断节点nodeType是否为1, 如是为元素节点,跳过。