HTML 页面上 Document 对象表示整个 HTML 文档。Document 对象是 Window 对象的一部分，可以通过 window.document 属性访问到。

Document 对象提供了许多属性和方法，用于对当前 HTML 文档进行操作和访问。接下来我们将详细介绍 Document 对象的一些常用属性和方法，并给出使用示例。

常用属性：

1. document.title：获取或设置当前文档的标题，可以用来动态修改页面标题。

示例：document.title = "新标题";

2. document.documentElement：获取文档的根元素 。

示例：var root = document.documentElement;

3. document.body：获取文档的主体元素 。

示例：var body = document.body;

4. document.head：获取文档的头部元素 。

示例：var head = document.head;

5. document.URL：获取当前文档的完整 URL。

示例：var url = document.URL;

6. document.domain：获取或设置当前文档的域名。

示例：document.domain = "example.com";

常用方法：

1. document.getElementById(id)：通过元素 id 获取对应的元素。

示例：var element = document.getElementById("myElement");

2. document.getElementsByClassName(className)：通过元素的类名获取对应的元素列表。

示例：var elements = document.getElementsByClassName("myClass");

3. document.getElementsByTagName(tagName)：通过元素的标签名获取对应的元素列表。

示例：var elements = document.getElementsByTagName("div");

4. document.createElement(tagName)：创建指定类型的元素节点。

示例：var newDiv = document.createElement("div");

5. document.createTextNode(text)：创建包含指定文本的文本节点。

示例：var newText = document.createTextNode("Hello World");

6. document.querySelector(selector)：通过 CSS 选择器获取第一个匹配的元素。

示例：var element = document.querySelector(".myClass");

7. document.querySelectorAll(selector)：通过 CSS 选择器获取所有匹配的元素。

示例：var elements = document.querySelectorAll(".myClass");

8. document.write(content)：向文档中写入内容（注意：该方法会覆盖整个文档）。

示例：document.write("

Hello World

示例代码：

```

```

上述示例代码演示了一些常见的 Document 对象的使用方法。通过获取元素、修改内容、创建新元素等操作，可以实现对文档的动态操作和修改。同时，通过使用 CSS 选择器可以更精确地选取目标元素。

总结：Document 对象是 HTML 页面的根节点，提供了丰富的属性和方法用于对页面进行操作。掌握 Document 对象的使用方法，可以更灵活地操作和修改 HTML 页面的结构和内容。 如果你喜欢我们三七知识分享网站的文章， 欢迎您分享或收藏知识分享网站文章 欢迎您到我们的网站逛逛喔！https://www.37seo.cn/