【document在js中有什么用】在JavaScript中，`document` 是一个非常重要的对象，它是浏览器提供的全局对象之一，用于与网页的HTML文档进行交互。通过 `document` 对象，开发者可以访问和操作网页中的元素、内容以及结构。下面将从多个角度对 `document` 的作用进行总结，并以表格形式展示其常见用法。
一、document的作用总结
1. 获取页面元素
`document` 提供了多种方法来获取页面中的元素，如 `getElementById`、`getElementsByClassName`、`getElementsByTagName` 和 `querySelector` 等。这些方法使得 JavaScript 可以动态地修改页面内容。
2. 操作页面内容
通过 `document`，可以更改页面中的文本、样式、属性等，实现动态更新页面信息。
3. 创建和删除节点
使用 `createElement`、`appendChild`、`removeChild` 等方法，可以在运行时动态添加或移除页面中的元素。
4. 处理事件
虽然事件监听通常通过元素绑定，但 `document` 也可以作为事件的触发源，例如在页面加载完成后执行某些操作。
5. 读取页面信息
可以通过 `document.title` 获取页面标题，`document.URL` 获取当前页面的URL等。
6. 控制文档结构
通过 `document.body`、`document.head` 等属性，可以访问和操作文档的各个部分。
二、document常用方法及功能对照表
| 方法/属性 | 功能说明 |
| `document.getElementById(id)` | 根据ID获取元素 |
| `document.getElementsByClassName(className)` | 根据类名获取元素集合 |
| `document.getElementsByTagName(tagName)` | 根据标签名获取元素集合 |
| `document.querySelector(selector)` | 根据CSS选择器获取第一个匹配元素 |
| `document.querySelectorAll(selector)` | 根据CSS选择器获取所有匹配元素 |
| `document.createElement(tagName)` | 创建一个新的元素节点 |
| `document.write(text)` | 向页面写入文本或HTML代码 |
| `document.getElementById(id).innerText` | 获取或设置元素的文本内容 |
| `document.getElementById(id).innerHTML` | 获取或设置元素的HTML内容 |
| `document.body` | 获取页面的 `` 元素 |
| `document.head` | 获取页面的 `` 元素 |
| `document.title` | 获取或设置页面标题 |
| `document.URL` | 获取当前页面的URL |
三、总结
`document` 是 JavaScript 操作网页的核心对象，它提供了丰富的 API 来访问和修改 HTML 文档。无论是获取元素、修改内容，还是动态创建页面结构，`document` 都是不可或缺的一部分。理解并熟练使用 `document`，有助于开发者更高效地构建交互式网页应用。
