<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<style type ="text/css">
#divf {
width:400px;
border :1px solid #0094ff;
height :300px;
}
#divs {
width:300px;
border :1px solid #0094ff;
height :200px;
}
</style>
<script src="Scripts/jquery-1.8.2.min.js"></script>
<script type ="text/javascript">
$(function () {
//1.0 mouseenter 不会触发事件冒泡
//2.0 mouseover 会触发 事件冒泡
document.getElementById("divf").onclick = function (c) {
alert("divf,被点了" + c + " target=" + c.target + "currentTarget=" + c.currentTarget);
//target 表示当前触发事件的元素
//currenttarget 表示当前执行事件的元素
};
document.getElementById("divs").onclick = function (c) {
alert("divs,被点了" + c+" target="+c.target+"currentTarget="+c.currentTarget);
// c.stopPropagation();//阻断事件冒泡
c.preventDefault();//阻断事件的默认行为
};
$("div").click(function (e) {//此时的e事件参数由jquery传入
alert(this.id + e);
// e.stopPropagation();//阻断事件
// e.preventDefault();//阻断事件默认行为
});
});
</script>
</head>
<body>
<div id ="divf">
<div id="divs"></div>
</div>
</body>
</html>
