JavaScript mouseover and mouseout events, if there are child elements inside the binding element,
Mouseover and mouseout events will be triggered multiple times when binding elements.
jquery solution:
jquery's mouseenter and mouseleave methods have fixed this problem and can be used directly to replace mouseover and mouseout
However, there is a small problem with mouseenter and mouseleave. When the mouse directly enters the element of the binding event from outside the document, mouseenter does not take effect.
The temporary solution is to not allow elements of the binding event to rely on the browser edge, and try to leave at least 1px spacing.
In addition, jquery's hover() method is equivalent to using mouseenter and mouseleave. It can also solve the problem of mouseover and mouseout.