通过节点层次关系获取节点

<!--
通过节点的层次关系获取节点对象。

关系:
1、父节点:parentNode:对应一个节点对象。
2、子节点:childNodes:对应一个节点集合。
3、兄弟节点:
上一个兄弟节点:parviousSibling
下一个兄弟节点:nextSibling
-->
<script type="text/javascript">
function getNodeByLevel(){
//获取页面中的表格节点
var tabNode = document.getElementById("tabid");

//获取父节点。parentNode
//var node = tabNode.parentNode;
//alert(node.nodeName);

//获取子节点。childNodes
//var nodes = tabNode.childNodes;
//alert(nodes[0].childNodes.nodeName);


//获取兄弟节点
//上一个
var node = tabNode.previousSibling;
alert(node.nodeName);

var node = tabNode.nextSibling;
alert(node.nodeName);
//注意:尽量少用兄弟节点,因为在解析的时候会出现浏览器解析不一致。
//会解析出标签见的空白文本节点
}
</script>
<input type="button" value="通过节点层次关系获取节点" onclick="getNodeByLevel()" />

<div>div区域</div>
<table id="tabid">
<tr>
<td>单元格一</td>
<td>单元格二</td>
</tr>
</table>
<dl>
<dt>上层项目</dt>
<dl>下层项目</dl>
</dl>
</div>
<a href="" >一个超链接</a>

posted @ 2014-06-09 20:36  是但哥  阅读(473)  评论(0编辑  收藏  举报