<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
</head>
<body>
<div>div1</div>
<div>div2</div>
<div>div3</div>
</body>
</html>
<script src="js/jquery-3.5.1.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
$("div").css({
width:200,
height:"200px",
backgroundColor:"pink",
margin:20
})
$("div:first-child").click(function(){
console.log("div1被点击了!!!");
})
$("div:first-child").mouseenter(function(){
console.log("鼠标进入div1啦!!");
})
$("div:nth-child(2)").on("click", function(){
console.log("div2被点击啦!!");
});
function aaaa(){
console.log("单独把函数写出来!!双击击了div3");
}
$("div:nth-child(3)").on("dblclick", aaaa);
$("div:nth-child(3)").on("dblclick", function(){
console.log("这是div3的另一个双击事件!!!");
})
$("div:first-child").off("click");
$("div:nth-child(3)").off("dblclick", aaaa);
$("div").hover(function(){
console.log("鼠标来了!");
$(this).css("background-color", "seagreen");
},
function(){
console.log("鼠标走了!!");
$(this).css("background-color", "pink");
})
</script>
