鼠标悬停事件：触发鼠标移动和移开操作

鼠标移动事件和鼠标移开事件的组合，通常称为鼠标悬停事件（hover）。

当鼠标移动到元素上时，会触发第一个函数；当鼠标移开元素时，会触发第二个函数。这是一种常用的交互方式，可以实现多种效果，例如：

• 显示工具提示
• 改变元素外观
• 播放动画
• 触发其他事件

示例代码：

const element = document.getElementById('myElement');

element.addEventListener('mouseover', function() {
  // 鼠标移动到元素上时执行的代码
  console.log('鼠标移动到元素上');
});

element.addEventListener('mouseout', function() {
  // 鼠标移开元素时执行的代码
  console.log('鼠标移开元素');
});

注意：

• 鼠标悬停事件只在鼠标悬停在元素上时才会触发。
• 可以通过 CSS 的 :hover 选择器来实现类似的效果。
• 在某些情况下，鼠标悬停事件可能会与其他事件冲突，需要谨慎使用。