Web API 基本认知

作用和分类

作用: 就是使用 JS 去操作 html 和浏览器

分类：DOM (文档对象模型)、BOM（浏览器对象模型）

DOM

概念：DOM（Document Object Model——文档对象模型）是用来呈现以及与任意 HTML 或 XML文档交互的API

DOM（Document Object Model）是将整个 HTML 文档的每一个标签元素视为一个对象，这个对象下包含了许多的属性和方法，通过操作这些属性或者调用这些方法实现对 HTML 的动态更新，为实现网页特效以及用户交互提供技术支撑。

作用：用来动态修改 HTML 的，其目的是开发网页内容特效和实现用户交互

DOM树

概念

概念：将 HTML 文档以树状结构直观的表现出来，我们称之为文档树或 DOM 树

作用：文档树直观的体现了标签与标签之间的关系

DOM 节点

节点是文档树的组成部分，每一个节点都是一个 DOM 对象，主要分为元素节点、属性节点、文本节点等。

1. 【元素节点】其实就是 HTML 标签，如上图中 head、div、body 等都属于元素节点。
2. 【属性节点】是指 HTML 标签中的属性，如上图中 a 标签的 href 属性、div 标签的 class 属性。
3. 【文本节点】是指 HTML 标签的文字内容，如 title 标签中的文字。
4. 【根节点】特指 html 标签。
5. 其它...

document

document 是 JavaScript 内置的专门用于 DOM 的对象，该对象包含了若干的属性和方法，document 是学习 DOM 的核心。

上述列举了 document 对象的部分属性和方法，我们先对 document 有一个整体的认识。

DOM对象

概念：浏览器根据html标签生成的 JS对象

• 所有的标签属性都可以在这个对象上面找到
• 修改这个对象的属性会自动映射到标签身上

DOM的核心思想

把网页内容当做对象来处理

document 对象

概念：是 DOM 里提供的一个对象

它提供的属性和方法都是用来访问和操作网页内容的

例：document.write()

网页所有内容都在document里面