事件侦听器不适用于某些 HTML 元素

Question

我有 2 组 HTML 按钮，全部带有 class btn 。

 const btn = document.querySelectorAll('.btn'); const btnArray = Array.from(btn); btnArray.forEach((item) => { item.addEventListener('click', () => { console.log('clicked'); console.log(item.value) }); });

 <div class="calculator"> <div class="display"> <p class="output">YES</p> </div> <div class="operations"> <input type="submit" class="btn add" value='+'> <input type="submit" class="btn subtract" value='-'> <input type="submit" class="btn multiply" value='x'> <input type="submit" class="btn divide" value=&divide;> <input type="submit" class="btn clear" value='CLEAR'> </div> <div class="calcBody"> <input type="submit" class="btn seven" value='7'> <input type="submit" class="btn eight" value='8'> <input type="submit" class="btn nine" value='9'> <input type="submit" class="btn four" value='4'> <input type="submit" class="btn five" value='5'> <input type="submit" class="btn six" value='6'> <input type="submit" class="btn one" value='1'> <input type="submit" class="btn two" value='2'> <input type="submit" class="btn three" value='3'> <input type="submit" class="btn zero" value='0'> <input type="submit" class="btn period" value='.'> <input type="submit" class="btn off" value='ON/OFF'> </div> </div>

这仅适用于calcBody div 中的按钮，而不适用于operations div 中的按钮。 然而，当我console.log(btnArray)它显示所有按钮（这很奇怪）。

有人能告诉我为什么吗？ 谢谢。

Answer 1

完美运行。 我在谷歌浏览器上检查过。