javascript之DOM

DOM

1.什么是DOM？

HTML DOM 定义了访问和操作HTML文档的标准方法。DOM是Document Object Model(文档对象模型的缩写)。 

DOM标准被分为三个不同的部分：

　　（1）核心DOM - 针对任何结构化文档的标准模型。

　　（2）XML DOM - 针对XML文档的标准模型。

　　（3）HTML DOM - 针对HTML文档的标准模型。

2.什么是XML DOM？

　　定义了所有XML的属性和方法，以及访问它们的方法。

3.什么是HTML DOM？

　　HTML DOM 定义了所有HTML的属性和方法，以及访问他们的方法。换言之，HTML DOM是关于如何获取，修改，添加，删除HTML元素的标准。

在 HTML DOM 中所有的事物都是节点：

• 整个文档是一个文档节点。
• 每个HTML元素是元素节点。
• HTML元素的内的文本是文本节点。
• 每个HTML的属性是属性节点。
• 注释是注释节点。

HTML DOM 节点树。

　　　　　　　　　　　　　　　　

 

 　　　　　　　　　　　　　　　　　　　　　　

HTML DOM 方法

　　方法是我们可以在节点（HTML元素）上执行的动作。

　　(1).编程接口

　　　　可通过Javascript对HTML DOM进行访问。

　　　　所有的HTML元素被定义为对象，而编程接口则是对象的属性和方法。属性是你能够获取的值，方法是你能够执行的动作。

　　(2).HTML DOM对象的方法。

　　　　常用方法：

　　　　　getElementById() //返回带有指定ID的元素。

　　　　　appendChild() //插入新的子节点。

　　　　　removeChild() //删除子节点。

　　　　　createElement() //创建新的节点。

　　　　　createTextNode() //创建新的文本节点。

　　　　

　　　　　　　　　　　　　　　　　

HTML DOM属性

　　nodeName 属性：规定节点的名称。

• nodeName 是只读的
• 元素节点的 nodeName 与标签名相同
• 属性节点的 nodeName 与属性名相同
• 文本节点的 nodeName 始终是 #text
• 文档节点的 nodeName 始终是 #document

　   nodeValue 属性：规定节点的值。

• 元素节点的 nodeValue 是 undefined 或 null
• 文本节点的 nodeValue 是文本本身
• 属性节点的 nodeValue 是属性值

 　 nodeType属性：规定节点的属性。

　　　　

　　访问 HTML 元素（节点）

　　　　访问 HTML 元素等同于访问节点

　　　　您能够以不同的方式来访问 HTML 元素：

• • 　　通过使用 getElementById() 方法

  • 　　通过使用 getElementsByTagName() 方法

  • 　　通过使用 getElementsByClassName() 方法

创建新的HTML元素。