<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>New Web Project</title>
<style type="text/css">
li{
float:left;
margin-left:50px;
list-style:none;
}
</style>
<script src="js/jQuery1.11.1.js"></script>
<script src="js/jquery-migrate-1.2.0.js"></script>
<script type="text/javascript">
$(function () {
//dom 2 级注册 bind()
//live
$("li").live({
mouseover:function(){
$(this).css("background","pink");
},
mouseout:function(){
$(this).css("background","");
}
});
$("li").die("mouseout");
//on 推荐使用
/* $("li").on({ //选择元素
mouseover:function(){ //将li和mouseover事件绑定
$(this).css("background","pink");
},
mouseout:function(){ //复合绑定mouseout
$(this).css("background","");
}
});
$("li").off("mouseout"); //off()用来解除mouseout事件绑定
*/
//delegate
/* $("ul").delegate("li",{
mouseover:function(){
$(this).css("background","pink");
},
mouseout:function(){
$(this).css("background","");
}
});
$("ul").undelegate("mouseout"); */
/* $("li").bind({
mouseover:function(){
$(this).css("background","pink");
},
mouseout:function(){
$(this).css("background","");
}
});
//卸载事件
$("li").unbind("mouseout mouseover"); */
});
</script>
</head>
<body>
<ul>
<li>首页</li>
<li>公司信息</li>
<li>人才计划</li>
</ul>
</body>
</html>
原文：http://www.cnblogs.com/Chenghao-He/p/7102580.html