关于javascript跨浏览器宽度解决方案

Question

我正在尝试 devise 跨浏览器解决方案，以便在 javascript 中获取当前设备宽度（以像素为单位），以便与平板电脑和移动设备的引导程序断点相对应。 （我这样做是有原因的，因为这个逻辑必然会检测设备方向，所以请开玩笑。）最好的现代解决方案是什么来检测这个并在 Safari、Edge、Chrome 和 Firefox 上产生一致的值？

到目前为止，这是我用来检测此问题的 javascript 方法。 到目前为止，我正在使用 jquery 来检测设备宽度。

export function isMobileBrowser(){
  let windowWidth =
$(window).width();
  let check = windowWidth <= 575.98 //bootstrap small device widths, mobile phones
  return check;
}

export function isTabletBrowser(){
let windowWidth =
$(window).width();
   let check = windowWidth <= 991.97 //bootstrap medium device widths, tablets.
   return check;
}

注意：我尝试过使用用户代理，但我发现这可能不是最可靠的答案。 （老实说，包含有关此问题的评论的 StackOverflow 帖子很旧，但我不想冒任何风险。这是该线程只是为了满足您的好奇心： 检测设备是否为平板电脑）。

Answer 1

根据 w3schools，您可以使用window.screen并获取屏幕本身的高度和宽度，而不是浏览器 window。

const { width, height } = window.screen;