当用户与网页上的元素进行交互时，我们可以通过JavaScript在HTML页面中添加事件监听器来捕获这些交互事件。例如，如果用户将鼠标悬停在一个元素上，我们可以使用mouseover事件来触发一些动作或行为。
HTML引入JavaScript
要在HTML中添加JavaScript代码，你需要使用<script>标签将其包裹起来，并指定它是JavaScript代码：
<script type="text/javascript"> // JavaScript code goes here </script>
该代码必须放置在<head>和<body>标签之间，通常建议将其放置在<head>标签内。
监听鼠标事件
我们可以使用addEventListener()方法来为一个元素添加事件监听器。以下是添加mouseover事件监听器的示例：
-- -------------------- ---- -------
--------- -----
------
------
---------------- ---------------
-------
------
---- ---------------- ---- ---------
------- -----------------------
--- ------- - ---------------------------------
------------------------------------- -----------
---------- ------- ---- --- -------
---
---------
-------
-------在这个例子中，我们首先通过document.getElementById()方法获取了ID为“myDiv”的元素。然后，我们使用addEventListener()方法添加了一个mouseover事件监听器。当用户将鼠标悬停在这个元素上时，alert()函数将显示一个消息框。
你可以为任何元素添加事件监听器，例如按钮、链接、图像等等。只需使用document.querySelector()或document.querySelectorAll()方法获取所需的元素，并添加事件监听器即可。
小结
在HTML页面中，我们可以使用JavaScript代码为元素添加事件监听器。通过监听鼠标事件，我们可以捕获用户与网页上的元素进行交互的时刻，并在需要时触发相应的动作或行为。掌握这些技术可以大大增强你的前端开发能力，在网页设计和开发过程中提供更多的灵活性和交互性。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/11953
