html/css/JavaScript基础

js获取屏幕宽高

2019-02-26  本文已影响0人  RachelCT

js中有几个获取屏幕宽高的属性,今天看书遇到有所困惑,所以查看资料对比以后记录下来以防以后忘记。

Element.clientWidth
Element.clientHeight

获取元素内部的宽度和高度,不包括滚动条和工具栏的宽度和高度。可以这样理解:clientWidth=CSS Width + CSS Padding - 滚动条宽度(如果存在),同样的clientHeight=CSS Height + CSS Padding - 滚动条宽度(如果存在)。

$(window)..width()
$(window).height()

获取元素的宽高,也是不包括滚动条和工具栏的宽度,与上一种方法获取到的宽高效果一样。

window.innerWidth
window.innerHeight

innerWidth获取到的宽度与前两种方法相比会包含纵向滚动条的宽度但不包含工具栏的宽度;innerHeight包含横向滚动条的宽度但不包含工具栏的宽度。

window.outerWidth
window.outerHeight

outerHeight包括了横向滚动条的宽度和工具栏的宽度。

上一篇 下一篇

猜你喜欢

热点阅读