什么是前端的dom，咱也来定一个“POM”

dom也叫dom对象，是浏览器对HTML文本解析后得到的，留在浏览器内存中的一个JS对象，俗称“文档对象模型”，其实dom元素就是一个浏览器生成的JavaScript对象啦。

 

我看过网上很多对dom的解释，但是我个人感觉很多都不太准确。在我看来，没那么复杂，dom就是一个浏览器根据网页源代码生成的一个JavaScript对象。

 

一个网页，对浏览器而言就是一个大的dom，网页中各个HTML节点，也被称为一个个小dom。

 

既然是对象，自然有很多方法，这是必然的。我们通过dom的对应api去操作网页上的HTML元素，这个过程就成为dom操作。

 

从本质来看，dom是一个实实在在的东西，是一个浏览器生成的对象。

 

可是，网上也有将dom解释为接口:

 

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

 

什么是接口？

 

就是我对于某个事物提供了一系列的增删改查方法，这些方法，就是接口。

 

比如，你给我一个土豆🥔，我定义了切丝，油炸，削皮，爆炒四个操作。那么，我也可以说，我TM定义了一个土豆操作模型(potato object model ，简称POM)，是我个人推荐的，处理土豆的标准编程接口。

 

这么讲可能还是有点抽象。

 

想象一下，我们处于一个游戏世界，你得到一本技能书，上面写着potato。你执行这个命令，就得到了一个土豆。

 

let p = potato.create()

 

然后你调用油炸方法

 

p.fryAndGet()

 

你就得到了一个炸过的土豆。

 

potato是技能书自带的关键字，p是一个POM对象。

 

看吧，没什么大不了的。

 

综上，面试的时候咋说呢？

 

从定义上看，

 

dom 是操作HTML的标准编程接口。

 

从使用上看，

 

dom 是浏览器解析HTML后得到的JS对象，包含了一系列操作它的一系列api方法。

 

背下来就行了，没必要太过纠结字面含义。