javaScript 屏幕宽高,浏览器宽高

记录下js取得屏幕,浏览器宽高的方法, 方便以后查看.

通过写简单html页面进行验证. 调整浏览器位置,大小后,刷新页面,查看控制台输出.
(如有错漏,请指正.谢谢!)

宽高

结果

总结如下:

上图红色线从上到下, 依次是

1. window.screen.width
   电脑屏幕宽度
2. window.screen.availWidth
   电脑屏幕除去左右两侧工具栏的宽度(上图中左右两侧没有工具栏)
3. window.outerWidth
   整个浏览器的宽度(包括浏览器侧边工具栏及浏览器边框)
4. window.innerWidth
   浏览器内部可见区的宽度(包括浏览器滚动条,但不包括浏览器侧边工具栏)
5. document.documentElement.clientWidth
   浏览器内部可见区的宽度(包括浏览器滚动条,但不包括浏览器侧边工具栏)

上图紫色线从左到右, 依次是

1. window.screen.height
   电脑屏幕高度
2. window.screen.availHeight
   电脑屏幕除去顶部及底部工具栏的高度
3. window.outerHeight
   整个浏览器的高度(包括浏览器工具栏,状态栏,…,及浏览器边框)
4. window.innerHeight
   浏览器内部可见区的高度(包括浏览器滚动条,但不包括浏览器工具栏,状态栏)
5. document.documentElement.clientHeight
   浏览器内部可见区的高度(包括浏览器滚动条,但不包括浏览器工具栏,状态栏)

本文来自互联网用户投稿，文章观点仅代表作者本人，不代表本站立场，不承担相关法律责任。如若转载，请注明出处。 如若内容造成侵权/违法违规/事实不符，请点击【内容举报】进行投诉反馈！