無法使用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