                        课程
                    
                        /前端开发
                        
                            /JavaScript
                        
                        /JavaScript进阶篇

屏幕宽度和浏览器可视宽度对比的问题

我笔记本用screen.width输出屏幕宽度是1366，为什么用window.innerWidth输出值是1517，浏览器可视窗口比整个屏幕都大，这合理吗？

s10143129

2017-09-04

源自：JavaScript进阶篇 9-18

关注问题我要回答

1768

操作

收起

3 回答

慕移动9181930
2022-03-27

测试成功，恭喜...这你要理解 i f ...e l s e i f ...e l s e 的判断机制，他是当第一个条件不成立时直接进行第二个条件，依次类推，所以你在第二个和后面是不需要多余的条件语句的

0 回复有任何疑惑可以回复我~

收起回答

这就尴尬了
2018-04-24

因为有滚动条，innerwidth的宽是包含不可视滚动条那一部分的。

0 回复有任何疑惑可以回复我~

收起回答

慕沐2804471
2017-09-06

screen：屏幕。这一类取到的是关于屏幕的宽度和距离，与浏览器无关，应该是获取window对象的属性。
client：使用区、客户区。指的是客户区，当然是指浏览器区域。
offset：偏移。指的是目标甲相对目标乙的距离。
scroll：卷轴、卷动。指的是包含滚动条的的属性。
inner：内部。指的是内部部分，不含滚动条。
avail：可用的。可用区域，不含滚动条，易与inner混淆。

window.innerWidth/innerHeight：浏览器可见区域的内宽度、高度（不含浏览器的边框，但包含滚动条）。兼容：ie9/10、chrome、firefox。

window.screen.availWidth/availHeight:屏幕的可用宽度、高度（通常与屏幕的宽度、高度一致）。兼容性：ie6/7/8/9/10、chrome、firefox。