BOM 中的 window 对象：浏览器的核心

window 对象是 BOM（浏览器对象模型）的核心，是 JavaScript 访问浏览器窗口和与之交互的界面元素的桥梁。window 对象提供了许多属性、方法和事件，可以用来操作浏览器窗口和网页，是 Web 开发人员必不可少的重要工具之一。

window 对象的属性

window 对象具有许多属性，其中一些常用的属性包括：

• window.location：表示当前的 URL。可以用来获取当前网页的 URL，并修改它来导航到其他页面。
• window.history：表示浏览器的历史记录。可以用来获取用户访问过的页面列表，并返回到之前的页面。
• window.navigator：表示浏览器的信息，如名称、版本、语言等。
• window.screen：表示浏览器窗口的大小和分辨率。
• window.document：表示当前的 HTML 文档。可以用来访问 HTML 文档的元素，如标题、、链接等。

// 获取当前 URL
console.log(window.location.href);

// 获取浏览器的名称
console.log(window.navigator.userAgent);

// 获取浏览器窗口的大小
console.log(window.screen.width, window.screen.height);

// 获取 HTML 文档的标题
console.log(window.document.title);

window 对象的方法

window 对象也具有许多方法，其中一些常用的方法包括：

• window.open()：打开一个新的浏览器窗口或选项卡。
• window.close()：关闭当前的浏览器窗口或选项卡。
• window.alert()：弹出警示消息框。
• window.confirm()：弹出确认对话框。
• window.prompt()：弹出输入对话框。

// 打开一个新的浏览器窗口
window.open("https://www.google.com");

// 关闭当前的浏览器窗口
window.close();

// 弹出警示消息框
window.alert("Hello, world!");

// 弹出确认对话框
if (window.confirm("Are you sure?")) {
  // 用户点击了“确定”
} else {
  // 用户点击了“取消”
}

// 弹出输入对话框
const name = window.prompt("What is your name?");

window 对象的事件

window 对象还支持许多事件，其中一些常用的事件包括：

• window.onload：当 HTML 文档加载完成时触发。
• window.onresize：当浏览器窗口的大小发生改变时触发。
• window.onscroll：当浏览器窗口滚动时触发。
• window.onclick：当浏览器窗口被点击时触发。
• window.onkeydown：当键盘上按下某个键时触发。

// 当 HTML 文档加载完成时执行
window.onload = function() {
  // 做一些事情
};

// 当浏览器窗口的大小发生改变时执行
window.onresize = function() {
  // 做一些事情
};

// 当浏览器窗口滚动时执行
window.onscroll = function() {
  // 做一些事情
};

// 当浏览器窗口被点击时执行
window.onclick = function() {
  // 做一些事情
};

// 当键盘上按下某个键时执行
window.onkeydown = function(event) {
  // 做一些事情
};

结论

window 对象是 BOM 的核心，提供了对浏览器窗口和与之交互的界面元素的访问。通过理解和使用 window 对象的属性、方法和事件，Web 开发人员可以轻松地操作浏览器窗口和网页，并编写出更加丰富和交互性的网页。