Use JS to set the HTML page mouse hover when changing the background picture

First, each Li is added with a move-in event onmouseover, and the event source is set in the hover event

JS style should be found in the first page of the UL

And then all the li inside the UL

var ln = bg.queryselectorall ("Li");

Get the trigger event element in the Move function

var leg = e.target;//Gets the trigger event element the target event property returns the destination node of the event (the node that triggered the event).

Initialize the background image inside the loop

Set the background picture when hovering the mouse

Event source triggers a mouse hover event

If the background style defined in the initialization is defined in the inline style, then the inline style should be used instead of the class style when the picture is last changed, because the inline style takes precedence over the class style

Element one of an event, event Source:? Refers to the event that the element raises, such as: The event source for this event is event with Target to get the events element two, event:? An event is an action performed, such as: The event is onmouseover () three, the event driver? The result of the execution Example: The background picture of the last set change

Use JS to set the HTML page mouse hover when changing the background picture