获取浏览器窗口宽度，包括滚动条

Question

我尝试使用$(window).width();获取浏览器窗口宽度。在IE 10上，它确实返回完整的浏览器宽度，包括滚动条。但是，在Firefox和Chrome上，两者都返回没有滚动条的值。

如何将滚动条一起包含在浏览器宽度中？因为我需要检测到的宽度与CSS完全相同。

感谢。

Answer 1

第一个答案很接近，但经过进一步检查，它有点复杂。 body.clientWidth是不包括滚动条的宽度。 window.outerWidth是包含滚动条和窗口边框等其他窗口元素的宽度。 window.innerWidth是窗口的实际宽度，包括滚动条，但不包括窗口边框。

Answer 2

这将获得完整Window的宽度：

 window.outerWidth

注意： jQuery的outerWidth()无效$(window)

Answer 3

在响应式设计需要时，

window.innerWidth似乎是正确的答案

Answer 4

window.innerWidth将给出HTML的宽度和。此值是在CSS中使用媒体查询时用于设备宽度断点的值。本质上，window.innerWidth等于计算的CSS单位100vw。但是，window.outerWidth将为您提供整个窗口的宽度。

例如，如果您在浏览器的内部中打开了Chrome的开发工具，则window.outerWidth将是网页的宽度+滚动条+ Chrome的开发工具检查器。而window.innerWidth仅返回网页+滚动条的宽度。