A5下载 - 努力做内容最丰富最安全的下载站!

A5站长下载站

当前位置:A5下载 > 源码技巧 > 父类数据 > Javascript节点关系实例分析

Javascript节点关系实例分析

时间:2015-05-15 11:08作者:zhao人气:28

本文实例分析了Javascript的节点关系。分享给大家供大家参考。具体如下:

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>节点关系</title>

<script type="text/javascript">

function Demo() {

var divObj = document.getElementById("divDemo");

//获取父节点

var parentNode = divObj.parentNode;

//displayNodeInfo(parentNode);

//获取子节点

var childNodes = divObj.childNodes;

//子节点返回的是一个集合,即数组

//alert(childNodes.length); //显示节点个数

//displayNodeInfo(childNodes[0]);

//获取兄弟节点

//----------获取上一个兄弟节点

var preBrotherNode = divObj.previousSibling.previousSibling;

//标签之间存在空行时,会出现一个空白的文本节点,在获取节点时,一定要注意。

//displayNodeInfo(preBrotherNode);

//----------获取下一个兄弟节点

var nextBrotherNode = divObj.nextSibling;

displayNodeInfo(nextBrotherNode);

}

function displayNodeInfo(node) {

alert("Name:" + node.nodeName + ",Type:" + node.nodeType + ",Value:" + node.nodeValue);

}

</script>

</head>

<body>

<input type="button" value="测试" onclick="Demo()" />

<div id="divDemo">div内容</div>

<table>

<tr>

<td>单元格1</td>

<td>单元格2</td>

</tr>

<tr>

<td>单元格3</td>

<td>单元格4</td>

</tr>

</table>

</body>

</html>

希望本文所述对大家的javascript程序设计有所帮助。

标签Javascript,节点,关系,实例分析,本文,实例分析

相关下载

查看所有评论+

网友评论

网友
您的评论需要经过审核才能显示

公众号