jQuery：检查窗口是否小于像素以外的x单位（例如em，rem）？

Question

听起来微不足道但我怎么能真正检查这个？我在SASS中有以下断点：

$width_breakpoints: (
        small: 39.9375em,
        medium: 40em,
        large: 76em
);

现在我要查看以下内容（伪代码）：

if($(window).width() < 39.9375em) {
    // add current-mode-mobile class to a certain element
}

如何实际检查宽度是否小于X em或X rem或X％？

Answer 1

对于IE10 +：

if (window.matchMedia("(min-width: 39.9375em)").matches) {
  /* the viewport is at least 39.9375 em wide */
} else {
  /* the viewport is less than 39.9375 em wide */
}

Answer 2

这是一个甚至不需要jQuery的解决方案。

var widthInEm =  window.innerWidth /
          parseFloat(getComputedStyle(document.querySelector('body'))['font-size'])

if(widthInEm < 39.9375) {
   // add current-mode-mobile class to a certain element
}