如何根据媒体查询更改Javascript变量？

Question

可以根据CSS媒体查询更改Javascript变量吗？例如。我在javascript中有一个名为deviceSize的变量，默认情况下它被设置为desktop。我有3种不同的媒体查询，分别针对台式机、平板电脑和移动设备。如何让Javascript知道它正在被使用的媒体查询？

我想这样做是因为我想在移动设备上禁用我的游戏的某些功能。我的游戏是一个扫雷游戏，它有三个难度等级。由于deviceSize，它从16x16网格开始。所以我希望javascript根据CSS检测到的媒体查询来改变这个变量。因此，我将deviceSize设置为移动，并以8x8网格开始游戏。

这是我的游戏：https://github.com/sacredcandies/minesweeper

Answer 1

尝试此操作以获取宽度和高度

 function getWidthAndHeight() {
      let width= window.innerWidth;
      let height= window.innerHeight;
}

Answer 2

为什么不直接使用window.innerWidth来决定显示器的大小呢？

https://www.w3schools.com/jsref/prop_win_innerheight.asp