概述
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
div{
width: 100px;
height: 100px;
background-color: deeppink;
color: springgreen;
border: 1px solid yellow;
margin: 10px;
float: left;
padding: 30px;
text-align: center;
}
</style>
</head>
<body>
<!-- 对比onmouseover与onmouseenter的区别 -->
<!--onmouseenter 不支持冒泡-->
<div id="div1" onmouseenter="myFunc1()">
<p>onmouseenter:<br><span id="demo1">鼠标移动到这里</span></p>
</div>
<div id="div2" onmouseover="myFunc2()">
<p>onmouseover:<br><span id="demo2">鼠标移动到这里</span></p>
</div>
<script type="text/javascript">
var i = 0;
var j = 0;
function myFunc1(){
var demo1 = document.getElementById("demo1");
demo1.innerHTML = i += 1;
}
function myFunc2(){
var demo2 = document.getElementById("demo2");
demo2.innerHTML = j += 1;
}
</script>
</body>
</html>
最后
以上就是开心绿草为你收集整理的onmouseover与onmouseenter的区别的全部内容，希望文章能够帮你解决onmouseover与onmouseenter的区别所遇到的程序开发问题。
如果觉得靠谱客网站的内容还不错，欢迎将靠谱客网站推荐给程序员好友。
发表评论 取消回复