这是我做的方式，我在IE 8 -> 10, FF 35, Chrome 40中尝试过，它将在所有现代浏览器(作为窗口)中工作得非常流畅。innerWidth是定义的)，在IE 8(没有window.innerWidth)，它工作顺利，任何问题(如闪烁，因为溢出:“隐藏”)，请报告它。我不是真的对视口高度感兴趣，因为我做这个函数只是为了解决一些响应工具，但它可能会被实现。希望它能有所帮助，我感谢评论和建议。

function viewportWidth () {
  if (window.innerWidth) return window.innerWidth;
  var
  doc = document,
  html = doc && doc.documentElement,
  body = doc && (doc.body || doc.getElementsByTagName("body")[0]),
  getWidth = function (elm) {
    if (!elm) return 0;
    var setOverflow = function (style, value) {
      var oldValue = style.overflow;
      style.overflow = value;
      return oldValue || "";
    }, style = elm.style, oldValue = setOverflow(style, "hidden"), width = elm.clientWidth || 0;
    setOverflow(style, oldValue);
    return width;
  };
  return Math.max(
    getWidth(html),
    getWidth(body)
  );
}

你可以用窗户。innerWidth和window。innerHeight属性。

如果你正在使用React，那么在最新版本的React钩子中，你可以使用这个。

// Usage
function App() {
   const size = useWindowSize();

   return (
     <div>
       {size.width}px / {size.height}px
     </div>
   );
 }

https://usehooks.com/useWindowSize/

你可以使用 窗口。addEventListener('resize'，你的函数); 当窗口调整大小时，它将运行你的函数。 当你使用window的时候。innerWidth或document.documentElement.clientWidth它是只读的。 你可以在你的函数中使用if语句，使它更好。

您可以简单地使用JavaScript window.matchMedia()方法根据CSS媒体查询检测移动设备。这是检测移动设备的最佳和最可靠的方法。

下面的例子将告诉你这个方法是如何工作的:

<script>
$(document).ready(function(){
    if(window.matchMedia("(max-width: 767px)").matches){
        // The viewport is less than 768 pixels wide
        alert("This is a mobile device.");
    } else{
        // The viewport is at least 768 pixels wide
        alert("This is a tablet or desktop.");
    }
});
</script>

jQuery维函数

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