DOM_Node对象

最新推荐文章于 2024-08-27 15:48:31 发布

田田田田__

最新推荐文章于 2024-08-27 15:48:31 发布

阅读量153

点赞数

分类专栏： DOM

本文链接：https://blog.csdn.net/weixin_42061805/article/details/81505928

版权

DOM 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

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>