---

HTML DOM 事件是网页开发过程中非常重要的一个概念。DOM（文档对象模型）是一种API（应用程序接口）, 用于Web页面和XML文档的读取和操作。要理解DOM 事件，需要先掌握几个基本概念。

什么是HTML DOM 事件？

HTML DOM 事件是指用户或浏览器对Web页面元素进行操作时, 引起浏览器或页面元素相应处理动作, 从而实现用户交互的行为。这些行为包括鼠标点击、键盘输入、页面加载、表单提交等。

事件的种类

事件可分为三类: 用户事件、浏览器事件和HTML DOM 事件。

用户事件是由用户在Web页面上直接引发的 操作, 如点击鼠标、键盘输入等。

浏览器事件是由Web浏览器引发的, 如页面加载、页面大小发生变化等。

HTML DOM事件是由Web页面中的元素操作引发的事件。这些元素包括图片、链接、表单、按钮等。

事件的绑定

DOM事件绑定是把事件与js代码函数关联起来，使事件发生时自动触发函数。通过事件处理程序或事件监听器来绑定事件。

事件处理程序

事件处理程序是一个js函数，旨在响应事件。当事件发生时，浏览器调用事件处理程序来处理该事件。以下是一个事件处理程序的示例：

<button onclick="alert('谢谢你！')">单击这里</button>

这里的事件处理程序是alert()函数，当用户单击按钮时，浏览器将调用该函数来弹出一个警报窗口。

事件监听器

使用事件监听器来绑定事件处理程序。监听器函数会在事件发生时被浏览器调用来响应该事件。示例代码如下：

const btn = document.querySelector('#myBtn');

function showAlert() {
  alert('谢谢您！');
}

btn.addEventListener('click', showAlert);

线程中的代码会给ID为myBtn的按钮绑定一个单击事件监听器，当用户点击该按钮时，浏览器将调用showAlert()函数来响应该事件。

事件冒泡

事件冒泡是指父元素先响应事件再到子元素。例如，在文档树上单击div元素时，先响应div事件，然后再响应祖先元素的事件。如果您不想让事件在整个DOM树中进行冒泡传播，您可以使用“阻止事件冒泡（stopPropagation()）”方法。

事件默认行为

事件默认行为是指浏览器在触发事件时执行的操作。例如，单击链接时，浏览器会打开链接。通过javascript来阻止浏览器执行默认行为，您可以使用“阻止事件默认行为”方法。

结论

HTML DOM 事件是Web开发过程中非常重要的一部分，它可以让我们更好地处理用户和浏览器响应。您可以使用DOM事件来为Web页面添加交互，并使用事件监听器来绑定和响应事件。同时，您可以使用阻止事件冒泡和阻止事件默认行为等方法来控制事件的行为。希望这篇文章能够对您理解HTML DOM事件有所帮助。