Untitled

1.DOM节点
在 HTML DOM 中，所有事物都是节点。DOM 是被视为节点树的 HTML。
HTML 文档中的所有内容都是节点：
整个文档是一个文档节点	document
每个 HTML 元素是元素节点	h1
HTML 元素内的文本是文本节点（包括空格）
每个 HTML 属性是属性节点
注释是注释节点

2.DOM 节点关系
节点父、子和同胞
节点树中的节点彼此拥有层级关系。
父（parent）、子（child）和同胞（sibling）等术语用 于描述 这些 关系。父节点拥有子节点。同级的子节点被称为同胞（兄弟或姐妹）。
在节点树中，顶端节点被称为根（root）
每个节点都有父节点、除了根（它没有父节点）
一个节点可拥有任意数量的子节点
同胞是拥有相同父节点的节点
3.节点属性
1）.nodeName
定义和用法
nodeName 属性指定节点的节点名称。
如果节点是元素节点，则 nodeName 属性返回标签名。
如果节点是属性节点，则 nodeName 属性返回属性的名称。
文本节点的nodeName 永远 #text
对于其他节点类型，nodeName 属性返回不同节点类型的不同名称

实例：获得 body 元素的节点名称：


document.body.nodeName;
	function myFunction(){
		var txt="";
		var c=document.body.childNodes;
		for (i=0; i<c.length; i++) {
  			txt=txt + c[i].nodeName + "<br>";
		};
	    var x=document.getElementById("demo");
          x.innerHTML=txt;
     }


2).nodeValue
定义和用法：nodeValue 属性设置或返回指定节点的节点值。
注释：如果您希望返回元素的文本，请记住文本始终位于文本节点中，并且您必须返回文本节点的值（element.childNodes[0].nodeValue）。

内网通截图20190131152216.png

3).nodeType
定义和用法：nodeType 属性返回以数字值返回指定节点的节点类型。
如果节点是元素节点，则 nodeType 属性将返回 1。
如果节点是属性节点，则 nodeType 属性将返回 2。
如果节点是文本节点，则 nodeType 属性将返回 3。
如果节点是注释节点，则 nodeType 属性将返回 8。


<body>
<p id="demo">请点击按钮来获得 body 元素子节点的节点类型</p>
<button onclick="myFunction()">试一下</button>
</body>
<script>
	function myFunction(){
		var txt="";
		var c=document.body.childNodes;
		for (i=0; i<c.length; i++) {
 			 txt=txt + c[i].nodeType + "<br>";};
			var x=document.getElementById("demo");
			x.innerHTML=txt;}
</script>