什么是window对象? 什么是document对象?

王小婷

发布于 2023-10-26 14:40:26

4130

发布于 2023-10-26 14:40:26

文章被收录于专栏：编程微刊

在浏览器环境中，window 对象和 document 对象是 JavaScript 提供的两个核心对象。

window 对象：

window 对象表示浏览器窗口或标签页。它是 JavaScript 中的全局对象，在浏览器环境中始终存在且可直接访问，无需引入额外的代码。

window 对象具有许多属性和方法，用于操作和控制浏览器窗口。例如，它可以用于打开新的窗口或标签页、获取和设置窗口的大小和位置、加载和导航网页等。

示例：

// 打开一个新窗口
window.open("https://www.example.com");

// 获取窗口的宽度和高度
const width = window.innerWidth;
const height = window.innerHeight;

// 导航到指定的网页
window.location.href = "https://www.example.com";

document 对象：

document 对象代表当前窗口或标签页中加载的 HTML 文档。它是 window 对象的一个属性，用于访问和操作文档的内容、结构和样式。

document 对象提供了许多方法和属性，用于查询和修改文档中的元素、创建、删除和修改元素、处理事件等。

示例：

// 获取文档中的元素
const heading = document.getElementById("myHeading");

// 修改元素的内容
heading.textContent = "Hello, world!";

// 创建新的元素并添加到文档中
const paragraph = document.createElement("p");
paragraph.textContent = "This is a new paragraph.";
document.body.appendChild(paragraph);

// 监听事件并执行相应的操作
document.addEventListener("click", function(event) {
  console.log("The document was clicked.");
});

通过 document 对象，可以访问和操作文档中的元素、样式和事件，从而实现与用户界面的交互和动态更新。

window 对象和 document 对象只在浏览器环境中存在，并且具体的功能和属性可能因浏览器的不同而略有差异。

本文参与腾讯云自媒体同步曝光计划，分享自作者个人站点/博客。

原始发表：2023-10-24，如有侵权请联系 cloudcommunity@tencent.com 删除

document