在 Web 开发中，document 对象是连接 JavaScript 与网页内容的桥梁。通过操作 document 对象，开发者可以动态地访问和修改网页的结构、内容和样式，从而实现丰富的交互效果。

一、document 对象概述

1. 什么是 document 对象

document 对象是浏览器为每个加载的网页创建的对象，代表整个 HTML 或 XML 文档。它是文档对象模型（DOM）的根节点，提供了操作文档的接口。通过 document 对象，开发者可以：

• 访问和修改页面中的元素和内容。
• 响应用户的交互事件。
• 动态更新页面的结构和样式。

2. document 对象的来源

当浏览器加载 HTML 文档时，会解析文档并生成对应的 DOM 树。document 对象就是这棵 DOM 树的根节点，表示整个文档的入口。每个浏览器窗口（或标签页）的全局对象是 window，而 document 是 window 对象的属性，因此可以通过 window.document 或直接使用 document 来访问。

二、document 对象的常用属性

document 对象提供了丰富的属性，方便开发者获取文档的各种信息。以下是一些常用的属性：

• document.title：获取或设置文档的标题，即 <title> 标签中的内容。
• document.URL：返回文档的完整 URL。
• document.domain：获取或设置文档的域名。
• document.referrer：返回链接到当前文档的文档的 URL。
• document.cookie：用于获取或设置当前文档的 cookies。

三、document 对象的常用方法

document 对象提供了多种方法，允许开发者动态地操作文档内容。以下是一些常用的方法：

1. 获取元素

• getElementById(id)：根据元素的 id 获取对应的元素。

  const header = document.getElementById('header');
  

• getElementsByClassName(className)：获取包含指定类名的所有元素，返回一个实时的 HTMLCollection。

  const items = document.getElementsByClassName('item');
  

• getElementsByTagName(tagName)：获取指定标签名的所有元素，返回一个实时的 HTMLCollection。

  const paragraphs = document.getElementsByTagName('p')