JavaScript DOM 编程艺术笔记

前言

本篇文章主要是复习一下基础，复习巩固一下 DOM 技术点。阅读了 2 个小时读完了，虽然书中很多内容比较老旧，不过经典永远不会过时。😁

什么是 DOM ？

DOM 是对文档内容进行抽化和概念化的方法。简单的说，就是用专有的名次来描述网站中的内容。

浏览器战争

在 1997 年那时，Netscape Navigator 和 IE 两大浏览器厂商进行对 DOM 大大的改进，对网站开发人员很不友好，得写两套规则代码，不然用户在使用时，样式或功能会失效。开发人员得检测当前用户使用的浏览器是哪种场景，然后执行对应的脚本。

指定标准

在 1998 年 10 月时，W3C 组织 联合 各个浏览器厂商指定了 “第一级 DOM 标准”

<aside>💡 W3C 推出的标准化 DOM 却可以让任何一种程序设计语言对使用任何一种标记语言编写出来的任何一份文档进行操控。

</aside>

更新标准之后获取元素只需要一行代码即可，不再需要写多个浏览器环境的代码

document.getElementById('btn')

之前的写法

Netscape Navigator

document.layer['btn'].  //Netscape Navigator document.layer['all'].  //微软公司

浏览器战争的结局

微软公司战胜了 Netscape ， 专有的 DOM 和 HTML 标记 的标准最终没有产生影响，IE 能获胜的原因，是因为运行 Windows 系统的电脑会预装 IE 浏览器。

<aside>💡 浏览器厂商都采用 W3C 指定的标准和推荐的标准，网站开发人员再也不需要写多种浏览器环境的代码来适配了。

</aside>

现在的浏览器厂商无一步争先恐后的实现最新的规范。

关于 DOM

“D O M” 各个字母代表的含义

DOM 全称为 “Document Object Model” 文档对象模型

D : 文档，浏览器会把你编写的网页文档 转换为 一个文档对象。

O ： 对象， document 对象主要用来处理网页内容，document 提供了方法和属性来操作对象。

M : 模型 ， 它是对网页的一种抽象化。

DOM 会把文档表示为一棵树，它会很展示文档的一个完整的关系结构图，一个文档会由网页中若干个 “节点 node” 组成。

节点

网页文档由节点组成。

节点分类：

• 元素节点 ： DOM 的原子就是 元素节点。

• 文档节点

• 属性节点 : 它是用来对元素做出更具体的描述。

结尾

欢迎一起交流讨论学习。