Javascript HTML/CSS/JS-更改不同的样式<；td>；s仅当按住ctrl/shift/alt键时

我目前正试图建立一个网页作为学习事件处理程序的一种方式，尽管我很难弄清楚我需要做什么才能使这项工作

现在，我有一个表，一行有4个单元格。我把它们做成这样的样式

#testCtrl, #testShift, #testAlt, #testMeta {
  background-color: black;
  color: white
  ...
}

我试图做的是在按下相应的键时更改单元格的背景色。问题是-我不熟悉语法以及我能做什么和不能做什么。。。此时我所知道的是，我需要通过ID将特定的td分配给一个变量，然后修改该变量

var _ctrlPress = document.getElementById("testCtrl");

我只是不知道如何测试当前是否按下了ctrl键，而且我也没有在网上找到太多关于它的信息，很可能是因为对搜索内容了解不够

另外，我不希望在这个时候使用jquery

我为你的无知道歉，非常感谢你抽出时间

编辑：在从评论中得到一些建议后，下面是我的想法。当应用到一个更大的文件时仍然会出现错误，尽管在我一直在修补的一个小测试HTML文档中，同样的概念可以很好地工作。。。我迷路了，哈

脚本部分：

window.addEventListener("keydown", function(ev) {
    var modP = ev.key;
    if ( modP=== "Shift" ) document.getElementById("testShift").classList.add("highlight");
});

样式部分：

#testCtrl, #testShift, #testAlt, #testMeta {
  background: black;
  color: white
}

.highlight {
  background: white !important;
  color: black !important;
}

最后，HTML部分（或至少相关位）：

移位
Ctrl键
中高音
元

我在哪里搞砸了

---

我再次为我的无知道歉。非常感谢您抽出时间。

将2

eventListener

添加到窗口。1个用于向下键控，1个用于向上键控。在按下键时，更改颜色。在设置关键帧时，将颜色更改回原来的颜色

window.addEventListener（“向下键”，函数（e）{
如果（/^1[6-8]$/.test（e.keyCode））{
document.body.style.backgroundColor=“#f00”；
}
});
addEventListener（“keyup”，function（））{
document.body.style.backgroundColor=“#aaa”；
});
检查下面的答案。如果可以的话，这个正则表达式在If语句中到底做了什么？我以一种对我有意义的方式修改了你的语法，并提出了一个解决方案，该解决方案在我的工作机器上使用测试html，但当我试图将其放入我实际上试图制作的网页时，它根本不起作用。我将在主帖子中发布代码，因为显然我无法在评论中对其进行格式化，哈。非常感谢您的回复！首先回答正则表达式将匹配什么。16、17和18。shift、ctrl和alt的键码。如果您输入更改后的代码，我可以hrlp您找到并更正错误@NFDL
<tr>
  <td id="fillShift"> Shift
  <td id="fillCtrl"> Ctrl
  <td id="fillAlt"> Alt
  <td id="fillMeta"> Meta
</tr>