BOM

BOM 是指浏览器对象模型,是用于描述这种对象与对象之间层次关系的模型。BOM由多个对象组成,其中代表浏览器窗口的Window对象是BOM的顶层对象,其他对象都是该对象的子对象。

window

BOM 的核心是window对象,所有在全局作用域中声明的变量、函数、对象都会作为window的属性和方法。

window对象属性

window.innerHeight属性,window.innerWidth属性
这两个属性返回网页的CSS布局占据的浏览器窗口的高度和宽度,单位为像素。
scrollX、scrollY

  • scrollX:滚动条横向偏移
  • scrollY:滚动条纵向偏移

这两个值随着滚动位置变化而变化,
scrollTo、scrollBy、scroll
我们可以通过方法scrollTo或者scroll方法改变滚动条位置到指定坐标。

window.scrollTo(0, 300); // 滚动条移动到300px处

两个参数分别是水平、垂直方向偏移。
scrollBy可以相对当前位置移动滚动条,而不是移动到绝对位置。

scrollBy(0, 100)   滚动条下移100px

navigator

Window对象的navigator属性,指向一个包含浏览器相关信息的对象。navigator.userAgent属性返回浏览器的User-Agent字符串,用来标示浏览器的种类。下面是Chrome浏览器的User-Agent。

navigator.userAgent  "Mozilla/5.0 (Macintosh; Intel Mac OS X 10_10_3) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/41.0.2272.118 Safari/537.36"

screen

 显示设备的高度,单位为像素
screen.height


显示设备的宽度,单位为像素
screen.width

window.getComputedStyle

getComputedStyle是一个可以获取当前元素所有最终使用的CSS属性值。返回的是一个CSS样式声明对象

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • (一)BOM对象 一、BOM是什么 dom,指的是页面上的元素,而bom是针对浏览器的一种对象模型,用于描述这种对...
    饥人谷_远方阅读 386评论 0 0
  • BOM是什么 BOM(Browser Object Model)是指浏览器对象模型,是用于描述这种对象与对象之间的...
    饥人谷_Tom阅读 310评论 0 0
  • 饥人谷进阶学习第 13 天 BOM 浏览器对象模型,是用于描述这种对象与对象之间层次关系的模型,浏览器对象模型提供...
    饥人谷1904_陈俊锋阅读 143评论 0 0
  • BOM BOM(Browser Object Model) 是指浏览器对象模型,是用于描述这种对象与对象之间层次关...
    YangJeremy阅读 637评论 0 51
  • 浏览器对象模型(Browser Object Model)也就是BOM BOM由多个对象组成,其中代表了浏览器窗口...
    郑宋君阅读 282评论 0 0

友情链接更多精彩内容