无法使用querySelector读取null的属性'addEventListener'

Question

我试过getElementsByClassName它得到了同样的错误，这很奇怪。在我的HTML我会改变<p id="trigger-overlay">到

<p class="trigger-overlay"> 

错误

function toggleOverlay(){alert('fire');}; 
var triggerBttn = document.querySelector('trigger-overlay'); 
triggerBttn.addEventListener('click', toggleOverlay); 

工作

function toggleOverlay(){alert('fire');}; 
var triggerBttn = document. getElementById('trigger-overlay'); 
triggerBttn.addEventListener('click', toggleOverlay); 

Answer 1

类选择应与.点开始：document.querySelector('.trigger-overlay');。

MDN：（ '触发叠加'）https://developer.mozilla.org/en-US/docs/Web/CSS/Class_selectors