在线客服
扫描二维码
下载博学谷APP
扫描二维码
关注博学谷微信公众号
前端浏览器对象模型BOM常用对象介绍,BOM即Broswer Object Model 浏览器对象模型,在JavaScript中可以理解为window对象,用来进行与浏览器相关的一些操作,学习BOM就是学习 JavaScript中的window对象。

一、window对象
BOM的核心对象是 window,它代表浏览器的一个实例。在浏览器中,window有着双重的角色:JavaScript访问浏览器的接口对象,ES中的Global对象意味着网页中的任何一个对象,变量,函数都是以window作为其Global对象。
1、全局作用域,在ECMAScript中,window对象扮演着Global对象的角色,也就是说,所有在全局作用域声明的变量,函数都会变成window的属性和方法,都可以通过 window.属性名(或方法名) 直接调。
2、导航和打开窗口,通过 window.open() 既可以导航到一个特定的URL,也可以打开一个新的浏览器窗口
二、location对象
[^location 是最有用的BOM对象之一,它提供了与当前窗口中加载的文档有关的信息]: JavaScript高级程序设计。
注: window.location 和 document.location?引用的是同一个对象。location 既是 window 对象的属性,也是 document?对象的属性。
三、 navigator对象
navigator 对象主要用来获取浏览器的属性,区分浏览器类型;
navigator 对象属性较多,且兼容性比较复杂。
四、history对象
history 对象保存着用户上网的历史记录,从窗口被打开的那一刻算起,因为 history 是 window 对象的属性,因此每个浏览器窗口,每个标签乃至每个框架,都有自己的 history对象与特定的 window 对象关联。
总结浏览器对象模型BOM中常用的对象有navigator,window, location, history
window既是 JavaScript 的全局对象,也是BOM的一个实例,所有的全局方法,属性,BOM中的属性,都可以通过 window. 来调用;
window作为BOM的实例,最常用的几个方法分别是:window.open(),window.close(),,分别用来打开和关闭浏览器窗口页面,这里需要注意的是,通过 open 方法打开的页面,才能通过close 方法关闭;
location对象也是用的比较多的一个BOM对象,主要用来操作URL相关的一些信息,除了修改 Hash 之外的任何属性,页面都会重新加载,历史记录会多加一条历史记录;
location对象还有一个 reload() 方法用于手动重新加载页面,该方法接收一个可选参数,为 true 的时候表示从服务器重新加载,否则可能从浏览器缓存中重新加载页面;
location对象 还有一个比较特殊的方法,location.replace(),该方法可以覆盖当前页面并重新加载,同时不会在 history 中生成历史记录;
navigator对象主要用来获取浏览器相关的一些信息,使用的时候需要注意兼容性。可以用来获取浏览器类(Chrome,safrai,FireFox,Edge,IE)等;
history对象主要用来操作浏览器URL的历史记录,可以通过参数向前,向后,或者向指定URL跳转。可以通过 length 属性获取记录数,判断当前页面是否是打开的首个页面;
— 申请免费试学名额 —
在职想转行提升,担心学不会?根据个人情况规划学习路线,闯关式自适应学习模式保证学习效果
讲师一对一辅导,在线答疑解惑,指导就业!
相关推荐 更多
2019年前端开发工程师好找工作吗?
Web前端工作还好找吗?Web市场是否已经饱和?Web前端前景如何?很多学习前端或者计划进入前端领域的小伙伴都会提出这样的思考!在移动互联网以及小程序的再次冲击下,前端工程师一度成为IT行业炙手可热的岗位之一。根据各大招聘网站数据显示,2019年,前端工程师岗位需求依旧呈现上升趋势。
10666
2019-08-08 10:12:25
学Javascript要看什么书?从入门到进阶书籍推荐
程序员想要完成一些简单的WEB前端需求,就必须掌握基础的JavaScript编程能力。因此为了方便大家学Javascript,小编整理了Javascript从入门到进阶的经典书籍,推荐给大家。
9829
2019-08-07 18:58:55
十个实用的CSS代码技巧整理
为了让大家高效率的进行工作,本文归纳总结了十个实用的CSS代码技巧,希望对大家能有所帮助。简单来说,这十大技巧分别是注意外边距折叠,使用flex进行布局,所有元素设置为Border-box,重置元素的CSS样式,使用transform属性来创建动画,短横线命名,不要使用!important,使用AutoPrefixer达到更好的兼容性,Caniuse和验证。
5791
2019-11-10 14:57:03
前端开发学习路线 Web前端知识点汇总
前端开发学习路线分享,学习前端要熟练掌握前端开发HTML、CSS、JavaScript等核心技术,熟练掌握Vue、React、Angular三大流行框架;使用面向对象思想进行编程,掌握应对业务编程的能力以及常见兼容性方案;前后端分工开发流程、原生Ajax请求流程与细节,掌握常见跨域技巧等相关知识。
6773
2020-04-28 17:00:39
2020年Web前端JavaScript面试题整理附答案
很快又要到一年一度的秋招热季,大家都准备好面试了吗?本文为大家整理了2020年最新出炉的Web前端JavaScript面试题,大家可以好好做一做,有什么不懂得地方再看答案,下面一起来查漏补缺吧!
6803
2020-07-31 10:17:38
