什么是DOM，一起来了解一波？

DOM概述

DOM简介

DOM（document Object Model，文档对象类型）可以以一种独立于平台和语言的方访问和修改一个页面文档的内容和结构，DOM将整个页面映射为一个由层次节点组成的文件，使用DOM可以让页面动态地变化。例如：可以动态地显示或隐藏一个元素，改变它的属性，增加一个元素等。

DOM的组成

• Core DOM：定义了一套标准的针对任何结构化文档的对象
• XML DOM ：定义了一套标准的针对XML文档的对象
• HTML DOM ：定义了一套标准的针对HTML文档的对象

节点和节点树

节点

节点树

• TML DOM

DOM对象

节点对象代表文档树中的一个节点，Node对象是整个DOM的核心对象

Node对象的属性

每个节点都拥有包含者关于节点某些信息的属性。

Node对象属性表

• nodeType: 显示节点的类型

  元素类型	节点类型
  元素	1
  属性	2
  文本	3
  注释	8
  文档	9

• nodeName：显示节点的名称

  • 元素节点的nodeName值是标签名称
  • 属性节点的nodeName值是属性名称
  • 文本节点的nodeName值永远是#text
  • 文档节点的nodeName值永远是#document

• nodeValue：显示节点的值

  • 对于文本节点，nodeValue属性包含文本内容。
  • 对于属性节点，nodeValue属性包含属性值。nodeValue属性对于文档节点和元素节点不可用。

• attributes：显示节点的类型

• firstChild：表示某一节点的第1个节点

• lastChild：表示某一节点的最后1个节点

• childNodes：表示所在节点的所有节点

• parentNode：表示所在节点的父节点

• nextSibling：紧挨着当前节点的下一个节点

• previousSibling：紧挨着当前节点的上一个节点

Node对象的方法

节点方法包含着对节点进行的各种操作。

• hasChildNodes()：判定一个节点是否有子节点，如果有返回true，如果没有返回false
• removeChild（node）：删除一个节点，node为删除的节点对象
• appendChild(node)：node为添加的节点对象。该对象用于向节点的最后一个子节点之后添加节点，如果要添加的节点DOM对象，该方法会移动节点，使用此方法可以从一个元素向另一个元素移动元素。
• replaceChild(newnode,oldnode)：用新节点替换某个字节点
• insertBefore(newnode,existingnode)：
• cloneNode(deep)：
• setAttribute(attributename,attributevalue)：
• getAttribute(attributename)：
• removeAttribute(attributename)：