老师请检查。我怎么发现onmousemove咋这么像onmouseover,效果原理上有啥区别?

老师请检查。我怎么发现onmousemove咋这么像onmouseover,效果原理上有啥区别?

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
<!DOCTYPE html>
<html>
    <head>
    <meta charset="UTF-8">
    <title>mouse</title>
    <style type="text/css">
    #div{overflow:auto;width:200px;height:200px;border:2px solid gray;margin-bottom:20px;}
    #content{width:200px;height:100px;border:2px solid gray;}
    </style>
</head>
<body>
<div id="div">
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod,tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo,consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse,cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non,proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</p>
</div>
<div id="content"></div>
<script type="text/javascript">
            var p=document.getElementById("div");
            var con=document.getElementById("content");
            p.onmousemove=function(){
                p.style.color="red";//什么时候用this?
            }
            p.onmouseout=function(){
                p.style.color="green";
                con.innerHTML="";
                 
            }
            p.onscroll=function(){
                con.innerHTML="内容滚动了";
            }
             
</script>
</body>
</html>


正在回答

登陆购买课程后可参与讨论,去登陆

1回答

首先,效果实现的很好

其次,两个事件的区别如下:

时间上 onmousemove 事件触发后,再触发 onmouseover 事件。

动作上 onmouseover 只在刚进入区域时触发。onmousemove 除了刚进入区域触发外,在区域内移动鼠标,也会触发该事件。

 简单的理解onmouseover与onmousemove的区别就是:当鼠标移过当前对象时就产生了onmouseover事件(onmouseover有个移入移出的过程),当鼠标在当前对象上移动时就产生了onmousemove事件,只要是在对象上移动而且没有移出对象的,就是onmousemove事件。

希望可以帮到你!


问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
请稍等 ...
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师
插入代码