[js] BOM

最新推荐文章于 2025-07-23 15:13:54 发布
原创 最新推荐文章于 2025-07-23 15:13:54 发布 · 272 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

window
innerheight 文档显示区高度
innerwidth 文档显示区宽度
length 窗口中框架数量
opener 创建此窗口的窗口的引用
top 顶级窗口的只读引用
screenLeft screenTop screenX screenY 窗口左上角在 屏幕 上的xy坐标

focus() blur() 给窗口焦点及移开焦点

location
assign(url) 打开一个新页面
reload(boolean) false 可用缓存 true 强制向服务器请求
replace(url) 打开新页面且在历史记录中替换

navigator
检测浏览器信息

screen
屏幕信息

history
length 历史列表中url数量
back() 加载前一个页面
forward() 加载下个页面
go(num) 加载第num个具体页面
go(url) 加载url，若不在历史列表中则不跳转

JavaScript BOM 对象详解
xycxycooo的博客
07-16 982
在 JavaScript 编程中，BOM（Browser Object Model）是指浏览器对象模型，它提供了一组用于与浏览器窗口进行交互的对象。BOM 对象允许开发者控制浏览器的行为和获取浏览器的信息。本文将详细介绍 JavaScript 中的 BOM 对象，并通过丰富的示例帮助你更好地理解。通过本文的详细讲解，相信你已经对 JavaScript 中的 BOM 对象有了全面的了解。在实际编程中，合理使用 BOM 对象可以提高代码的效率和可读性。对象是 BOM 的核心对象，代表浏览器窗口或标签页。
javaScript BOM简介
2403_88615647的博客
11-19 1569
4.1.1、BOM简介BOM（browser Object）即浏览器对象模型，它提供了独立于内容而与浏览器窗口进行交互的对象，其核心对象是window。BOM由一系列的对象构成，并且每个对象都提供了很多方法与属性BOM缺乏标准，JS语法的标准化组织是ECMA，DOM的标准化组织是W3C，BOM最初是Netscape浏览器标准的一部分4.1.2、DOM与BOM的区别类别DOMBOM1文档对象模型浏览器对象模型2DOM是把文档当做一个对象来看待把浏览器当做一个对象来看待3。
JavaScript BOM操作
brokyz
06-30 853
BOM （Browser Object Model）即浏览器对象模型，它提供了独立于内容而与浏览器窗口进行交互的对象，其核心对象是 window。BOM 由一系列相关的对象构成，并且每个对象都提供了很多方法与属性。BOM 缺乏标准，JavaScript 语法的标准化组织是 ECMA，DOM 的标准化组织是 W3C，BOM 最初是 Netspace 浏览器标准的一部分。window 对象是浏览器的顶级对象，它具有双重角色。在调用的时候可以省略 window，前面学习的对话框都属于 window 对象方法，如
JavaScript BOM详解
最新发布
1加1等于的博客
07-23 483
BOM 是浏览器提供的一套 API，用于操作浏览器窗口和页面以外的功能。与 DOM（文档对象模型）不同，BOM 没有统一标准（W3C 未完全标准化），但现代浏览器实现了大部分共性功能。window：BOM 的顶层对象，代表浏览器窗口document：DOM 的入口，也是window的属性location：控制 URL 和页面导航history：操作浏览器历史记录navigator：获取浏览器和系统信息screen：访问屏幕信息frames：操作页面内的框架。
JS BOM对象
hbl020305的博客
08-09 745
JS BOM对象
JS BOM Location
weixin_44154094的博客
01-24 313
Location1.定义1.1 location1.2 assign()1.3 reload()1.4 replace() 1.定义 Location * - 该对象中封装了浏览器的地址栏的信息 1.1 location 如果直接打印location，则可以获取到地址栏的信息（当前页面的完整路径） 如果直接将location属性修改为一个完整的路径，或相对路径 * 则我们页面会自动跳转到该路径，并且会生成相应的历史记录 location = "https://www.nxys.xyz";
JavaScript BOM操作(超详细)
wu_ry的博客
03-13 2035
由于window对象是全局对象，所以在使用window对象的属性和方法时，window可以省略不写.例如，之前直接使用的alert()方法、confirm()方法及prompt()方法的用法、本节主要讲解open()方法和close()方法，JavaScript定时函数会在后面中详细介绍。设置间谒调用的方法是setInterval(),接收的参数与setTimeout()方法相同，为要执行的代码和每次执行之前需要等待的毫秒数。可以通过数组的名称和下标直接访问数组的元素，访问数组的表示形式，数组名[下标]。
JavaScript之BOM 操作介绍
奋斗的小前端
02-05 857
不过，BOM 与严格标准化的 JS 语法（由 ECMA 组织规范）和 DOM（由 W3C 组织规范）不同，它最初源于 Netscape 浏览器的标准，在标准化方面存在一定缺失，这也导致了不同浏览器对 BOM 的支持和实现存在差异。然而，由于历史原因，navigator 对象中的大部分属性在现代浏览器中已不再可靠，无法准确地识别浏览器类型和版本。通过事件循环机制，JavaScript 能够在单线程环境下高效地处理同步和异步任务，实现复杂的交互功能和非阻塞的 I/O 操作，确保页面的流畅性和响应性。
JS（JavaScript）的BOM操作
博客主要分享技术教程、工具教程、bug解决、前沿技术动态、编程经验、心得感悟等。 内容同步、干货获取、推广宣发请看侧栏推广信息
07-01 1640
JavaScript共三部分组称：ECMAScript核心语法、DOM文档对象模型、BOM浏览器对象模型BOM就是浏览器对象模型以下是BOM的结构图。
Javascript BOM 思维导图
Jeyaker的博客
09-14 806
[html] http5
hudk114的专栏
09-26 1159
dataset<div data-to-do-sth="you know nothing" data-name="Jon Snow"></div> ele.dataset // DOMStringMap {toDoSth: "you know nothing", name: "Jon Snow"} ele.dataset.toDoSth // you know nothing ele.dataset
[http] 请求与常见状态码
hudk114的专栏
09-04 1076
GETPOST状态码 这里写链接内容 wiki状态码 1xx 消息（信息提示） 服务器收到请求，需要请求者继续执行操作 2xx 用于表示请求成功 3xx 重定向 用于已经移动的文件并且常被包含在定位头信息中指定新的地址信息 4xx 客户端错误 用于指出客户端的错误 5xx 服务端错误 用于支持服务器错误200 OK 请求已成功，请求所希望的响应头或数据体将随此响应返回 201 Cr
[js] 变量 操作符 对象
hudk114的专栏
09-01 833
ES5关键字和保留字数据类型 基本数据类型： Undefined, Null, Boolean, Number, String 复杂数据类型： Object(由一组无须名值对组成) 基本数据类型是按值访问的（保存在栈内存中），引用类型的值是保存在堆内存中的对象。js不允许直接访问内存位置，因此在操作对象时实际操作的是对象的引用而非对象本身 在为对象添加属性时操作的是对象本身（或者说会通过引用
[css] 框模型 流式布局
hudk114的专栏
09-02 725
框模型 早期ie有width兼容性问题，最好的解决方案是回避这个问题。即不给元素添加具有指定宽度的内边距，而是尝试将内边距或外边距添加到元素的父元素和子元素。 外边距合并 当两个垂直外边距相遇时，它们将形成一个外边距。合并后的外边距的高度等于两个发生合并的外边距的高度中的较大者 当一个元素包含在另一个元素中时（假设没有内边距或边框把外边距分隔开），它们的上和/或下外边距也会发生合并
[http] tips
hudk114的专栏
09-14 575
防止表单重复提交 disable掉按键 在服务端返回后应该恢复按键的可用性 发送端约束，上一个未返回不发送下一个 页面重定向 在返回过程中还是会有重复提交问题 服务端session比较 如果session不一样则认为是不同的请求 数据库约束 参考click me
[js] 原型 继承 委托
hudk114的专栏
08-29 548
每个函数都有prototype属性，prototype是一个指向原型对象的指针 例外：通过Function.prototype.bind方法构造出来的函数没有prototype属性 function Point(x, y) { this.x = x; this.y = y; } var Y = Point.bind(null, 0, 3); Point.prototype // Ob
[数据结构] 匹配算法
hudk114的专栏
10-05 438
算法实现 KMP kmp真是学到现在为止最头疼的一个算法，嗯我是渣渣 分两部分 一、子串的next数组；二、循环遍历。 next数组的意义是：第n项之前的若干项与第1到第next[n]-1项完全一样（前驱相同）。 因此next数组的寻找方式使用递归的想法： 对于当前位置i，有开头的最大子串长度为n； 对i+1，若j+1==i+1，那么最大子串长度为n+1；若j+1!=i+1，因为第j+
[js] ES6 函数
hudk114的专栏
07-24 434
参数默认function Man(firstName = 'Hu', secondName = 'DK') { console.log(`Hello, ${firstName} ${secondName}`); }Man(); // Hello, Hu DK Man('Zhao'); // Hello, Zhao DK // null不会触发默认值 Man(null, 'DW'); // H
[http] 跨域说明
hudk114的专栏
02-09 432
只是从http层角度说下跨域的问题，并不提供解决方法，解决方法在以前老的文章里写过 跨域 跨域的请求被拦截有两种可能： 1. 浏览器直接禁止发起跨域，例如在某些浏览器中HTTPS请求HTTP域请求不会发起； 2. 跨域请求发起了，但是返回结果被浏览器拦截，请求失败。 CORS w3c协议 CORS是一种利用额外HTTP头部来允许用户代理跨域请求的技术，与传统跨域方式不...
js bom
05-15
<think>好的，我现在需要处理用户关于JavaScript BOM的问题。首先，用户之前问过BOM和DOM，现在想深入了解BOM的使用指南。我得确保回答结构清晰，符合系统级指令，比如正确使用LaTeX格式，生成相关问题，还要引用给定的参考内容。 首先，回忆BOM的主要对象：window、location、navigator、screen、history。用户提供的引用里有提到location对象和setTimeout，这些要重点展开。比如，引用中的setTimeout例子可以用在讲解定时器部分，location对象的部分需要详细说明属性和方法。 接下来要组织内容，分点介绍每个BOM对象。每个部分需要包含常用属性和方法，并给出代码示例。比如，window对象控制窗口大小、打开关闭窗口；location用于URL操作；navigator获取浏览器信息；screen获取屏幕信息；history管理历史记录。 需要注意代码示例的正确性，比如setTimeout返回timeId，clearTimeout来取消。引用中的例子有var timeId = setTimeout(...)，然后在function里取消，这部分可以引用到讲解中，但用户提供的代码片段不完整，可能需要补充说明。 另外，系统指令要求生成相关问题，我需要根据BOM内容提出相关问题，比如BOM和DOM的区别，location对象的方法，定时器的使用等。还要确保LaTeX格式正确，虽然BOM内容可能数学公式较少，但如果有表达式，比如计算屏幕尺寸的示例，需要用$...$包裹。 检查是否有遗漏的部分，比如事件处理、浏览器兼容性问题，这些可以作为优化或注意事项提及。同时，引用用户提供的参考内容，例如在讲解location对象时添加引用标识[^1]。 最后，确保回答使用中文，结构清晰，分点说明，并附上相关问题和代码示例。避免使用Markdown格式，但用户示例中的代码块是允许的。确认所有要求都满足后，整合内容，形成自然流畅的回答。</think># JavaScript BOM 使用指南 ## 一、BOM 核心对象解析 JavaScript BOM（浏览器对象模型）提供了与浏览器交互的接口，主要包含以下对象： 1. **window 对象**（顶级对象） - `innerWidth/innerHeight`: 获取视口尺寸，例如：当前窗口宽度为$w=window.innerWidth$像素 - `open()/close()`: 窗口控制 ```javascript let newWindow = window.open('https://example.com', '_blank'); ``` 2. **location 对象**[^1] - `href`: 完整URL地址 - `reload()`: 刷新页面 ```javascript location.href = 'https://newpage.com'; // 页面跳转 ``` 3. **navigator 对象** ```javascript console.log(navigator.userAgent); // 输出浏览器信息 ``` 4. **screen 对象** ```javascript console.log(`屏幕分辨率：${screen.width}x${screen.height}`); ``` 5. **history 对象** ```javascript history.back(); // 返回上一页 ``` ## 二、定时器与异步控制 使用$t=5000$毫秒的定时器示例： ```javascript var timeId = setTimeout(function() { console.log("定时任务执行"); }, 5000); // 取消定时器 clearTimeout(timeId); ``` ## 三、应用场景与最佳实践 1. 页面跳转与URL参数解析 2. 浏览器特性检测 3. 定时任务管理 4. 历史记录操作（SPA应用核心） ## 四、注意事项 1. 浏览器兼容性问题需用特性检测解决 2. 定时器需及时清理防止内存泄漏 3. 窗口操作可能被浏览器拦截
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值