为什么打字稿水龙头只能在第一次点击时工作

Question

我的问题是当我点击点击时，只有第一次点击才有效，当我点击另一个点击时显示错误

Uncaught TypeError: Cannot read properties of undefined (reading 'classList')

这是我的代码 https://codepen.io/rodkeaw-rk/pen/NWavQPY

Answer 1

如果您查看您的 html，您会发现您有多个 id 为“panals”的元素

所以当你打电话时

let panals = document.getElementById('panals')

无论您点击哪个面板，它都会返回第一个 id 为“panals”的元素。这将是“约翰”面板。因此，当您单击“安娜”并尝试做时

panals.getElementsByClassName('Anna')[0]

它将返回 undefined，因为面板始终是 John 面板。