<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script src="js/jquery3.6.0.js"></script>
</head>
<body>
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
<script>
// // mouseover
// // jquery支持链式操作
// $('li').on('mouseover',function(){
// $(this).css('background',"red");
// }).on('mouseout',function(){
// $(this).css('background',"green");
// })
// // 事件解绑
// // 第一个参数是事件名称
// // 第二个参数是callback name
// $("li:eq(3)").off("mouseout");
// // 添加新元素给ul
// $("<li>newLi</li>").appendTo("ul")
// 使用事件代理
$("ul").on('mouseover',"li:event",function(){
$(this).css('background',"red");
}).on('mouseout',"li:event",function(){
$(this).css('background',"green");
})
$("<li>newLi</li>").appendTo("ul")
</script>
</body>
</html>