欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

bom相关操作知识点

程序员文章站 2022-07-14 11:01:25
...

1. 什么是bom

BOM ( Browser Object Model )即浏览器对象模型,它提供了独立于内容而与浏览器窗口进行交互的对象,其核心对象:是window。
BOM由一系列相关的对象构成,并且每个对象都提供了很多方法与属性。
BOM缺乏标准, JavaScript语法的标准化组织是ECMA , DOM的标准化组织是W3C , BOM最初是Netscape浏览器标准的一部分。

 BOM

  • 浏览器对象模型
  • 把「浏览器」当做一个「对象」来看待
  • BOM 的*对象是window
  • BOM学习的是浏览器窗口校互的一些对象
  • BOM是浏览器厂商在各自浏览器上定义的,兼容性较差

BOM比DOM更大,它包含DOM.
bom相关操作知识点

window对象是浏览器的*对象,它具有双重角色。
1.它是JS访问浏览器窗口的一个接口。
2.它是一个全局对象。定义在全局作用域中的变业函数都会变量window对象的属性和方法。
在调用的时候可以省略window ,前面学习的对话框都属于window对象方法,如alert0、prompt0等。
注意: window下的一个特殊属性window.name

2.window常见事件

2.1窗口加载事件

window.onload = function() {}
或者
window.addEventListener ("load" , function() {}) ;

window.onload是窗口(页面)加载事件当文档内容完全加载完成会触发该事件(包括图像、脚本文件、CSS
文件等),就调用的处理函数。
注意:
1.有了window.onload就可以把JS代码写到页面元素的上方,因为onload是等页面内容全部加载完毕,
再去执行处理函数。
2. window.onload传统注册事件方式只能写一次,如果有多个,会以最后一个window.onload为准。
3.如果使用addEventListener则没有限制。

2.2调整窗口大小事件
 

window.onresize = function() {}
window.addEventListener ("resize", function() ({});

window. onresize是调整窗口大小加载事件,当触发时就调用的处理函数。
注意:

1.只要窗口大小发生像素变化,就会触发这个事件。
2.我们经常利用这个事件完成响应式布局。window.innerWidth 当前屏幕的宽度


3.location对象

3.1什么是location对象

window对象给我们提供了一个location属性用于获取或设置窗体的URL ,并且可以用于解析URL。因为
这个属性返回的是一个对象,所以我们将这个属性也称为location对球。

3.2 URL

统一资源定位符(Uniform Resource Locator, URL)是互联网上标准资源的地址。互联网上的每个文件都有
一个唯一的URL ,它包含的信息指出文件的位置以及浏览器应该怎么处理它。

bom相关操作知识点

3.3location对象的属性

bom相关操作知识点

3.4location对象的方法

bom相关操作知识点

4.navigator对象

navigator对象包含有关浏览器的信息,它有很多属性,我们最常用的是userAgent ,该属性可以返回由客
户机发送服务器的user-agent头部的值。
 

5.history对象

window对象给我们提供了一个history对象,与浏览器历史记录进行交互。该对象包含用户(在浏览器窗口中)
访问过的URL。
bom相关操作知识点

 

相关标签: javascript