javascript - jQuery/Javascript - 如何在所有浏览器（尤其是 Safari）中获取与 CSS 断点一致的浏览器窗口宽度？

Question

我一直在尝试使用 Javascript 或 jQuery 来检索浏览器窗口宽度并使其与我的 CSS 媒体查询一致。

当我设置浏览器以使标尺（和我的 CSS）显示它的宽度正好为 768 像素时，这是我使用 jQuery ($(window).width()) 和 Javascript (window.innerWidth) 获得的结果。

-------------------------------------------------------------------------
| Browser, OS                   | $(window).width() | window.innerWidth |
-------------------------------------------------------------------------
| Chrome, MacOS 10.13           |      753          |        768        |
-------------------------------------------------------------------------
| Safari, MacOS 10.13           |      768          |        783        |
-------------------------------------------------------------------------
| Chrome, MacOS 10.14           |      768          |        768        |
-------------------------------------------------------------------------
| Safari, MacOS 10.14           |      768          |        768        |
-------------------------------------------------------------------------
| Chrome, Windows 10            |      753          |        768        |
-------------------------------------------------------------------------
| Edge, Windows 10              |      751          |        768        |
-------------------------------------------------------------------------
| Internet Explorer, Windows 10 |      768          |        768        |
-------------------------------------------------------------------------
| Opera, Windows 10             |      753          |        768        |
-------------------------------------------------------------------------

如您所见，jQuery（我最初一直在使用）到处都是，我发现这很令人惊讶，并且在我的网站上引起了问题。使用 window.innerWidth 的普通 Javascript 似乎更加一致，但在 MacOS 10.13 上的 Safari（最新版本）中返回错误值。我们的大部分观众都在使用 Safari，所以我想使用当浏览器设置为 768 时所有浏览器都返回 768 的东西。

我可以尝试其他任何 Javascript 或 jQuery 属性吗？

编辑（回答评论）

html {
   font-size: 100%;
   -webkit-tap-highlight-color: rgba(0,0,0,0);
   font-family: sans-serif;
}
body {
   line-height: 1.42857143;
   margin: 0;
   font-family: 'Weissenhof-Grotesk', Tahoma, sans-serif;
   font-size: 16px;
   color: #000000;
   background-color: #fff;
}

标签： javascriptjquerysafari