1.2 什么是DOM
- DOM 是 Document Object Model——文档对象模型 的简称）
- DOM 是 W3C组织推荐的一套操作文档结构、样式和内容的技术标准（所有的浏览器都遵循了）
- 一句话概括：DOM是浏览器提供的一套专门用来 操作网页 的功能
DOM作用：开发网页内容特效和实现用户交互
1.3 DOM对象
DOM技术的核心
- 以对象的方式描述整个网页，定义了表示和修改网页内容所需的对象
-
网页中的任何内容都可以用对象来表示，操作这个对象会自动作用到网页身上
- 整个html网页用 文档对象 来表示
- 网页中的标签用 标签对象（元素对象）来表示
DOM的核心思想：把网页内容当做 对象 来处理
DOM对象：浏览器根据html标签生成的
JS对象
- 标签上的所有属性都可以在这个对象上面找到
- 修改这个对象的属性会自动映射到标签身上
document 对象：
- DOM 里表示整个网页（整个文档）的对象
-
所以它提供的属性和方法都是用来访问和操作网页内容的
- 例：document.write()
- 网页所有内容都在document里面
1.4 DOM树
DOM树是什么
- DOM技术将 HTML 文档和标签映射成对象后，形成了类似“倒着的大树”的组织结构
- HTML文档的树状结构，我们称之为 文档树 或 DOM 树
DOM树的作用
- DOM文档树直观的体现了标签与标签之间的关系
- 通过DOM树可以获取到网页上的任意内容
2. 获取DOM元素对象
2.1 选择匹配到的第一个元素
语法：document.querySelector("css选择器")
参数：包含一个或多个有效的CSS选择器
字符串
返回值： CSS选择器匹配的
第一个元素
，一个 HTMLElement对象。 如果没有匹配到，则返回null。
技术文档：
https://developer.mozilla.org/zh-CN/docs/Web/API/Document/querySelector
2.2 选择匹配到的多个元素
语法：document.querySelectorAll("css选择器")
参数：包含一个或多个有效的CSS选择器
字符串
返回值：CSS选择器匹配的
NodeList 元素对象集合（
伪数组
）
例如：
document.querySelectorAll("ul li")
得到的是一个
伪数组
：
- 有长度有索引号的数组
- 但是没有 pop() push() 等数组方法
想要得到里面的每一个对象，则需要遍历（for）的方式获得。
注意：
哪怕只有一个元素，通过querySelectAll() 获取过来的也是一个
伪数组
，里面只有一个元素
2.3 其他获取DOM元素方法
3. 操作元素内容
3.1 元素对象.innerText 属性
- 元素对象的innerText属性对应着标签的内容
- 通过innerText属性，就可以获取/更新标签的内容
- 纯文本，不解析标签
举例：
