代码如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>demo009基础事件</title>
<script type="text/javascript" src="jquery-1.12.4.min.js"></script>
<style type="text/css">
#box1{
width: 200px;
height: 200px;
background: green;
position: relative;
}
#box2{
width: 100px;
height: 100px;
background: red;
position: absolute;
top: 140px;
left: 100px;
}
</style>
</head>
<body>
<div id="box1">
<div id="box2"></div>
</div>
<strong></strong>
<script type="text/javascript">
/*$('#box1').mouseover(function(){
$('strong').html(function(index,value){
return value+1;
});
});*/
$('#box1').mouseenter(function(){
$('strong').html(function(index,value){
return value+1;
});
});
</script>
</body>
</html>
如果不给子元素box定位的话,mouseover()和mouseenter()的区别就是和老师在课中讲的一样,但是如果将子元素进行绝对定位到父元素外面的话,mouseover()和mouseenter()好像就没有区别,都会产生事件冒泡。
weibo_哆啦A梦有大口袋_0
相关分类