JavaScript开发必知：事件监听器详解及两种添加方法对比

事件监听器是在JavaScript中用来监听和响应特定事件的机制。事件可以是用户交互事件，如点击、键盘输入等，也可以是页面加载事件，如DOM加载完成等。 在JavaScript中添加事件监听器主要有两种方法：DOM 0级事件模型和DOM 2级事件模型。 1. DOM 0级事件模型： 这种方法是在DOM 0级标准中定义的，使用attachEvent和detachEvent方法来添加和移除事件监听器。这种方法的语法比较复杂，而且不支持冒泡和阻止默认行为，因此现在很少使用。 例如，要添加一个点击事件监听器，可以这样做： ```javascript element.attachEvent('onclick', function() { console.log('Element was clicked'); }); ``` 2. DOM 2级事件模型： 这种方法是在DOM 2级标准中定义的，使用addEventListener和removeEventListener方法来添加和移除事件监听器。这种方法的语法简单明了，支持冒泡和阻止默认行为。 例如，要添加一个点击事件监听器，可以这样做： ```javascript element.addEventListener('click', function() { console.log('Element was clicked'); }); ``` 注意：addEventListener方法的第一个参数是事件类型，第二个参数是事件处理函数，第三个参数是可选的布尔值，如果设置为true，那么事件处理函数不会冒泡到父元素。 也可以使用removeEventListener方法来移除事件监听器，方法的参数和addEventListener方法的参数是一样的。 ######[AI写代码神器 | 331点数解答 | 2023-11-09 00:51:36]