JavaScript 浏览器对象模型 (BOM) 提供了一组 API，可用于与浏览器进行交互，解锁其功能并增强 Web 应用程序。它允许开发人员操作浏览器窗口、文档、历史记录、位置和导航。本文将介绍 JavaScript BOM 的基本概念和用法。
浏览器窗口
window 对象是 BOM 的核心，它代表浏览器窗口。它提供了许多属性和方法来控制窗口的外观和行为。一些常见的属性包括：
window.innerWidth // 浏览器窗口的内部宽度
window.innerHeight // 浏览器窗口的内部高度
window.location // 浏览器窗口的当前位置一些常见的用于控制窗口的方法包括：
window.open("url") // 打开一个新的浏览器窗口
window.close() // 关闭当前浏览器窗口
window.resizeTo(width, height) // 调整窗口大小文档对象模型 (DOM)
document 对象表示当前 HTML 文档的结构和内容。它提供了用于访问和修改文档元素的属性和方法。一些常用的属性包括：
document.body // 文档的主体元素
document.head // 文档的头部元素
document.title // 文档的标题一些常见的用于修改文档的方法包括：
document.getElementById("elementId") // 获取具有指定 ID 的元素
document.createElement("elementName") // 创建一个新元素
document.appendChild(element) // 将元素添加到文档中导航
history 对象提供了用于控制浏览器历史记录的方法。它可以用于在浏览器历史记录中进行前进、后退或重新加载。一些常用的方法包括：
history.back() // 返回上一页
history.forward() // 前往下一页
history.go(n) // 相对当前页面前进或后退 n 页位置
location 对象提供了有关浏览器当前位置的信息。它可以用于获取或设置页面 URL。一些常用的属性包括：
location.href // 当前页面 URL
location.protocol // 当前页面协议（例如 http 或 https）
location.hostname // 当前页面主机名（例如 www.example.com）一些常见的用于控制位置的方法包括：
location.replace("url") // 替换当前页面 URL
location.reload() // 重新加载当前页面示例代码
以下是一个示例代码，演示了如何使用 BOM 来更改浏览器窗口的标题并从 URL 中获取参数：
// 更改浏览器窗口标题
document.title = "新标题";
// 从 URL 中获取查询参数
const urlParams = new URLSearchParams(window.location.search);
const parameterValue = urlParams.get("parameterName");结论
JavaScript BOM 提供了一组强大的工具，可用于控制浏览器窗口、文档、历史记录、位置和导航。通过了解 BOM 的基本概念和用法，Web 开发人员可以增强他们的应用程序并为用户提供更丰富的体验。
