HTML-DOM、XML-DOM、W3C-DOM三者之间的区别与联系

有许多人说，既然HTML可以直接使用属性名称进行访问，就像这样，

假如访问图片的地址，可以使用this.src，那为什么还要使用getAttribute("")方法呢？

getAttribute("")写起来总给人一种多写了代码的感觉，毕竟这个单词就挺长的。

 

下面我来说一下getAttribute("")与传统的写法有什么不同。

this.src这种写法可以称之为HTML-DOM，我为什么这么说呢，

是因为这种写法只适用于HTML文档中。

而this.getAttribute("src")这种写法可以称之为W3C-DOM,

或者标准DOM，理论上this.getAttribute("src")适用于使用任何一种

标记语言写出来的任何一份文档，比如说我们熟悉的XML文档。

在解析XML的时候，使用this.getAttribute("src")可以获得某一个节点的

src属性，this.src写法却是非法的，不能获取任何值。

有的人可能会问：为什么说是理论上呢？因为W3C只是提供了一个接口，至于

各个代理厂商如何实现和是否愿意实现就是另一回事了，所以说是理论上。

 

 

this.getAttribute("src")相对于this.src来说，还有一个优势，那就是

getAttribute可以获取自定义属性，比如说，你想给<a>起一个中文名字，

你定义了一个nameCn属性，this.getAttribute("nameCn")可以轻松获取到nameCn属性，

如果使用this.nameCn会得到一个undefined。这个有时候会对你起到意想不到的帮助的。

 

总结如下：

this.src这种方式只能获取HTML文档中元素本身已经有的属性。

this.getAttribute("src")可以实现以上功能，除此之外，最常见的就是

获取XML文档中的元素的自定义属性和HTML文档中的自定义属性。

 

初学者比较疑惑的是认为DOM都一样。

实际上我们所遇到的DOM基本上可以分为三种：

HTML-DOM、XML-DOM、标准DOM。

标准DOM的API在操作文档的时候是通用的，其它DOM API只是为了方便操作特定类型的文档提供了一些更加便利的操作方法。

 

 

像类似getAttribute的方法还有很多，这里就不一一列举了。

W3C提供的标准DOM接口基本上都是这样的方法。