标签：温故而知新 body 浏览器 复习 window BOM scrollTop document 页面

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

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。