<HTML><Head> <MetaCharSet= "UTF-8"> <Scriptsrc= "Jquery-3.3.1.js"></Script> <Scripttype= "Text/javascript">x=0; Y=0; $ (document). Ready (function(){ $("Div.over"). MouseOver (function(){ $(". Over span"). Text (x+=1); }); $("Div.enter"). MouseEnter (function(){ $(". Enter Span"). Text (y+=1); }); }); </Script></Head><Body><P>The MouseOver event is triggered regardless of whether the mouse pointer passes through the selected element or its child elements.</P><P>The MouseEnter event is triggered only when the mouse pointer passes through the selected element.</P><Divclass= "Over"style= "Background-color:lightgray;padding:20px;width:40%;float:left"> <H2style= "Background-color:white;">The Mouseover event that is triggered:<span></span></H2></Div><Divclass= "Enter"style= "Background-color:lightgray;padding:20px;width:40%;float:right"> <H2style= "Background-color:white;">The Mouseenter event that is triggered:<span></span></H2></Div></Body></HTML>
The difference between 3.mouseenter and mouseover events