浏览器的尺寸测量差异：window.outerwidth 与 window.innerwidth
在浏览器调试窗口中，window.outerWidth 和 window.innerWidth 打印的尺寸不一致，而且 window.innerWidth 大于 window.outerWidth。这个问题通常与 viewport 元数据的设置有关。
在加载页面后，浏览器需要时间来更新 viewport 元数据。因此，在页面加载后的最初几秒内，window.innerWidth 可能与调试窗口显示的尺寸不一致。过一段时间后，浏览器会更新 viewport 元数据，window.innerWidth 会与显示的尺寸一致。
如果您在页面
部分中添加了以下 viewport 元数据：
浏览器将根据设备宽度调整 viewport，并将其初始缩放比例设置为 1。这意味着 window.innerWidth 应该与设备的实际宽度一致。
如果您在读取 outerWidth 和 innerWidth 时遇到问题，可以输出 viewport 元数据的值，查看是否有异常：
console.log(window.outerWidth);console.log(window.innerWidth);console.log(document.querySelector('meta[name="viewport"]').content);
以上就是为什么 window.outerWidth 和 window.innerWidth 在调试窗口中显示不一致？的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1559207.html
微信扫一扫 
支付宝扫一扫 
