javascript提供多種事件監(jiān)聽器綁定方式：html事件屬性addeventlistener()方法事件代理domcontentloaded事件window.onload事件
JavaScript事件綁定
JavaScript提供了多種方法來綁定事件監(jiān)聽器，以響應(yīng)特定事件（例如單擊、懸停或鍵盤輸入）時(shí)執(zhí)行某些操作。最常用的方法有：
1. HTML事件屬性
這種方法直接在HTML元素的事件屬性中設(shè)置事件處理函數(shù)。例如：
<button onclick="alert('按鈕被點(diǎn)擊了！')">點(diǎn)我</button>
登錄后復(fù)制
2. addEventListener() 方法
更為靈活的方法是使用 addEventListener() 方法。該方法帶三個(gè)參數(shù)：
事件類型（例如 “click” 或 “mouseover”）
事件處理函數(shù)
是否在捕獲階段還是冒泡階段處理事件（可選）
例如：
const button = document.querySelector('button');
button.addEventListener('click', () => {
alert('按鈕被點(diǎn)擊了！');
});
登錄后復(fù)制
3. 事件代理
當(dāng)你想為大量元素綁定相同的事件處理程序時(shí)，事件代理可以提高效率。通過將事件處理程序綁定到父元素，可以避免為每個(gè)子元素單獨(dú)綁定。例如：
const container = document.getElementById('container');
container.addEventListener('click', (event) => {
const target = event.target;
if (target.tagName === 'BUTTON') {
alert('按鈕被點(diǎn)擊了！');
}
});
登錄后復(fù)制
4. DOMContentLoaded 事件
當(dāng)整個(gè)文檔加載完畢（包括解析、編譯和執(zhí)行腳本）時(shí)觸發(fā) DOMContentLoaded 事件。這可以用于在頁(yè)面加載后立即執(zhí)行代碼，例如綁定事件處理程序。
document.addEventListener('DOMContentLoaded', () => {
// 在這里綁定事件處理程序
});
登錄后復(fù)制
5. window.onload 事件
window.onload 事件在整個(gè)頁(yè)面（包括外部資源）加載完成后觸發(fā)。它不太常用，因?yàn)樵?DOM 加載完畢之前就觸發(fā)，導(dǎo)致在早期階段無(wú)法訪問 DOM 元素。
window.onload = () => {
// 在這里綁定事件處理程序
};
登錄后復(fù)制
