其他分享
首页 > 其他分享> > 温故而知新——BOM复习

温故而知新——BOM复习

作者:互联网

JavaScript BOM 操作

BOM操作就是操作浏览器相关的一些内容

列举一些简单的BOM操作

1、获取浏览器窗口尺寸:

宽度:window.innerWidth

高度:window.innerHeight

2、浏览器的弹出层:

提示框:window.alert()

询问框:window.confirm()

输入框:window.prompt()

3、开启和关闭标签页

开启:window.open()

关闭:window.close()

4、浏览器的历史操作:

回退:window.history.back()

前进:window.history.forward()

5、浏览器的常见事件:

资源加载完毕:window.onload = function () { }

页面尺寸改变:window.onresize = function () { }

滚动条位置改变:window.onscroll = function () { }

6、浏览器卷去的尺寸:

高度:{

页面头部有DOCTYPE标签:document.documentElement.scrollTop

页面头部无DOCTYPE标签:document.body.scrollTop

}

宽度:{

页面头部有DOCTYPE标签:docement.documentElement.scrollLeft

页面头部无DOCTYPE标签:document.body.scrollLeft

}

综合来写就是

高度:document.documentElement.scrollTop || document.body.scrollTop

宽度:docement.documentElement.scrollLeft || document.body.scrollLeft

7、浏览器滚动到:

window.scrollTo () 方法 

瞬时滚动:window.scrollTo ( left , top )

平滑滚动:window.scrollTo ( {

  left: xx,

  top:yy,

  behavior: 'smooth'

} )

标签:温故而知新,body,浏览器,复习,window,BOM,scrollTop,document,页面
来源: https://www.cnblogs.com/spikekk/p/16249506.html