Explain DOM elements and events in detail

1, mouse event

onclick //click
 ondblclick //double click
 onmouseover //mouse moves in
 onmouseout //mouse out
 onmousemove //Mouse movement

2. The document or element is loaded:

onload //The element or document is loaded

3. Form control state monitoring:

onfocus //The text box gets the focus
 onblur //The text box loses focus
 oninput //Real-time monitoring input
 onchange //Triggered when the input content changes twice, or when the element state changes
 onsubmit //form element monitoring, trigger after clicking the submit button, control whether the data can be sent to the server through the return value

Second, get the element node

1 , Get the list of element nodes according to the tag name

var elems = document.getElementsByTagName("");
 /*parameter: label name
 Return value: node list, you need to get the specific element node object from the node list, and add the corresponding subscript.
 */

2. Obtain the element node list according to the class attribute value

1. Inline method: bind the event name as a label attribute to the element

Example:

Click

2 , Dynamic binding: Get element nodes, dynamically add events

Example:

btn.Onclick= function (){
 };

Recommended tutorial: js introductory tutorial

The above is the detailed content of DOM elements and events. For more, please pay attention to other related articles on 1024programmer.com!