BOM（Browser Object Model）是浏览器厂商形成的事实接口集合，非W3C/ECMA标准；顶层对象为window，包含location、history、navigator、screen、frames等属性，用于JavaScript与浏览器交互。
什么是 BOM？它不是标准，但浏览器都实现了
BOM（Browser Object Model）不是 W3C 或 ECMA 的正式标准，而是浏览器厂商在长期实践中形成的事实接口集合。它描述的是 JavaScript 与浏览器窗口、导航、历史、屏幕等交互时可访问的对象体系。严格来说，window 是 BOM 的顶层对象，其他如 location、history、navigator、screen、frames 都是它的直接属性。
最常用且兼容性好的 BOM 对象有哪些
这些对象在所有现代浏览器中稳定存在，日常开发中高频使用：
-
window：全局对象，也是全局作用域本身；window.alert()、window.setTimeout()等都来自它 -
document：虽然属于 DOM，但通过window.document暴露，常被误认为 BOM —— 实际上它是 DOM 的入口，BOM 和 DOM 在window上交汇 -
location：当前 URL 信息，可读写；修改location.href会触发跳转，location.search解析查询参数 -
history：操作会话历史；history.pushState()和history.back()常用于 SPA 路由控制 -
navigator：提供客户端运行环境信息；navigator.userAgent（已逐渐不推荐）、navigator.onLine、navigator.permissions等 -
screen：获取屏幕尺寸和像素比；screen.width、screen.availHeight、screen.devicePixelRatio -
frames/self/top/parent：处理多 frame 场景下的上下文切换，注意跨域限制会抛出SecurityError
哪些“看起来像 BOM”的东西其实要小心
有些 API 名字像 BOM，但实际是较新标准或存在兼容性陷阱：
-
window.open()：确实是 BOM 方法，但现代浏览器普遍拦截非用户手势触发的弹窗，window.open('url', '_blank')可能返回null -
window.scrollTo()：BOM 方法，但旧版 IE 只支持两个数值参数，而现代用法支持{ top, left, behavior: 'smooth' }对象 —— 后者在 Safari 15.4 之前不支持 -
performance：虽挂载在window.performance下，但它属于 Performance API（W3C 标准），不是传统 BOM 成员；performance.now()比Date.now()更精准 -
localStorage/sessionStorage：属于 Web Storage API，不是 BOM；它们在私密模式下可能抛出QuotaExceededError，需 try/catch
BOM 没有统一规范，所以兼容性判断要看具体对象和属性
比如 navigator.connection（网络类型检测）在 Chrome/Firefox 中可用，但在 Safari 完全不可用；又比如 window.find() 是 Firefox 独有，Chrome 已移除。判断是否可用，别只查“BOM 支持列表”，而应：
立即学习“Java免费学习笔记（深入）”；
- 查 caniuse.com 搜索具体 API，如
history.pushState - 运行时检测：
if ('onLine' in navigator) { /* safe to use */ } - 避免依赖
window.outerWidth等受浏览器 UI 影响大的属性做布局计算 - 注意 SSR 场景：Node.js 中没有
window，服务端渲染时访问任何 BOM 对象都会报ReferenceError: window is not defined
真正容易被忽略的，是 BOM 的“隐式依赖”——比如你以为只是调了个 console.log，结果函数里悄悄用了 location.hostname，一到 Node 环境就崩。写工具函数前，先问一句：它是否真的只操作数据，还是偷偷瞄了一眼浏览器？
