JS DOM操作之一周总结知识点

1什么是DOM

文档对象模型（Document Object Model，简称DOM），是W3C组织推荐的处理可扩展置标语言的标准编程接口。

可以通过DOM接口改变页面的内容、样式和结构

2.节点

在 HTML DOM (Document Object Model) 中 , 每一个元素都是 节点

• 文档是一个文档节点。 --- nodeType 属性返回 9 document.nodeType

• 所有的HTML元素都是元素节点。 --- nodeType 属性返回 1 ele.nodeType

• 所有 HTML 属性都是属性节点。 --- nodeType 属性返回 2 ele.getAttributeNode('href').nodeType

• 文本插入到 HTML 元素是文本节点。--- nodeType 属性返回 3 ele.firstChild.nodeType

• 注释是注释节点。 --- nodeType 属性返回 8

  <script type="text/javascript">
  			let box = document.querySelector(".box");
  			// childNodes获取元素的所有子节点,包括换行节点
  			for (let i = 0; i < box.childNodes.length; i++) {
  				let node = box.childNodes[i];
  				// nodeName: 节点名称,
  				// nodeType: 节点类型,
  				// nodeValue: 节点值
  				console.log(node.nodeName, node.nodeType, node.nodeValue);
  			}
  		</script>