Node对象

Node对象的三个属性值

nodeType 节点类型

nodeName 节点名称

nodeValue 节点值

三种节点对象所对应的值

  nodeType nodeName nodeValue
标签 1 大写名称(如UL) null
属性 2 属性名称(如id) 值(如ulId)
文本 3  #text  文本内容

父节点、子节点、同辈节点

父节点:parentNode

子节点:childNodes(兼容性较差)、firstChild(第一个子节点)、lastChild(最后一个子节点)

同辈节点(兄弟节点):nextSibling(返回给定节点的下一个兄弟节点对象) 、previousSibling(返回给定节点的上一个兄弟节点对象)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head>

<body>
<ul id="ulId">
  <li>100</li>
  <li>200</li>
  <li>300</li>
  <li>400</li>
  <li>500</li>
</ul>
<script type="text/javascript">
  var ulId = document.getElementById("ulId");
  
  document.writeln(ulId.nodeType);
  document.writeln(ulId.nodeName);
  document.writeln(ulId.nodeValue);
  
  var id1 = ulId.getAttributeNode("id");
  document.writeln(id1.nodeType);
  document.writeln(id1.nodeName);
  document.writeln(id1.nodeValue);
  
  var tex = ulId.lastChild;
  document.writeln(tex.nodeType);
  document.writeln(tex.nodeName);
  document.writeln(tex.nodeValue);
  
  var preTex = tex.previousSibling;
  document.writeln(preTex.nodeType);
  document.writeln(preTex.nodeName);
  document.writeln(preTex.nodeValue);
</script>
</body>
</html>