JavaScript 窗口和 JavaScript 文档的区别

JavaScript 窗口（window）和 JavaScript 文档（document）是在 Web 开发中使用的两个重要概念。虽然它们经常被混淆和错误使用，但它们实际上有着不同的含义和用途。

JavaScript 窗口（window）

JavaScript 窗口是浏览器窗口（浏览器环境）的全局对象，它表示当前浏览器窗口或标签页。窗口对象提供了与当前浏览器窗口相关的一些方法和属性，使我们能够操控窗口的行为，例如打开新的窗口、关闭窗口、更改窗口大小等等。

在 JavaScript 中，窗口对象可以通过 window 关键字访问，例如 window.alert("Hello"); 用于在窗口中显示弹出窗口。

下面是一些常见的窗口对象的属性和方法：

• window.innerWidth 和 window.innerHeight：获取窗口的内部宽度和高度。
• window.location：获取或设置当前窗口的 URL。
• window.open()：打开一个新的窗口或标签页。
• window.alert()：在窗口中显示一个警告框。
• window.setTimeout()：在一定时间后执行指定的函数。
• ...

JavaScript 文档（document）

JavaScript 文档是指代当前窗口或标签页中的 HTML 文档对象模型（DOM），它表示网页的整个内容，包括 HTML 标签、元素和其它的 HTML 特性。文档对象模型使我们能够通过 JavaScript 来操作和改变网页的结构、内容和样式。

在 JavaScript 中，文档对象可以通过 document 关键字访问，例如 document.getElementById("myElement"); 用于获取 HTML 元素。

下面是一些常见的文档对象的属性和方法：

• document.getElementById()：通过元素的 ID 获取对应的元素。
• document.getElementsByTagName()：通过标签名获取一组元素。
• document.createElement()：创建一个新的 HTML 元素。
• document.querySelector()：通过 CSS 选择器获取匹配的第一个元素。
• document.getElementById().innerHTML：获取或设置元素的 HTML 内容。
• ...

总结

• JavaScript 窗口（window）是浏览器窗口对象，提供了与窗口相关的方法和属性。
• JavaScript 文档（document）是当前窗口的整个 HTML 文档对象模型，提供了与网页内容交互的方法和属性。
• 使用 window 可以操作整个窗口的行为，而使用 document 可以操作网页的内容。

请注意区分它们的使用场景和区别，以便在 Web 开发中正确使用它们。