jquery 写鼠标事件

jQuery是一种使用JavaScript编写的快速，小型和功能强大的库。它简化了HTML文档遍历和操作，事件处理，动画和AJAX交互。本文将介绍如何使用jQuery来写鼠标事件。

$(document).ready(function(){
  $("p").mouseenter(function(){
    $(this).css("background-color", "yellow");
  });
  $("p").mouseleave(function(){
    $(this).css("background-color", "white");
  });
});

在上面的代码中，我们使用了jQuery的 mouseenter() 和 mouseleave() 方法来创建针对鼠标悬停和移开事件的处理程序。在这个例子中，当鼠标悬停在

元素上时，这个元素的背景颜色将变成黄色，当鼠标移走时将回到默认的白色背景。

有时候，我们的元素是通过Ajax或JavaScript动态添加到页面上的。因此，我们可能需要使用on()方法来绑定鼠标事件处理程序：

$(document).ready(function(){
  $(document).on("mouseenter", "p", function(){
    $(this).css("background-color","yellow");
  });
  $(document).on("mouseleave", "p", function(){
    $(this).css("background-color", "white");
  });
});

该代码与先前的例子非常相似，但使用on()方法来绑定事件处理程序。当鼠标进入和离开

元素时，事件会委托至文档元素，该元素以赞成动态添加到页面的方式。

总之，鼠标事件是非常常见的交互设计任务，jQuery通过简化DOM遍历和交互，使这项工作更容易，并提供了鼠标事件API，使其更容易。