Several concepts _javascript skills of JavaScript related events

The client JavaScript program uses an asynchronous event-driven programming model.

Several concepts of related events:

　　Event Type: The string used to describe what type of event occurred;

　　Event Target: the object in which the event occurred;

　　event Handler Handler: a function that handles or responds to an event;

　　Event object: An object that is related to a specific event and that contains details about the event;

　　Event Propagation: the process by which the browser determines which object is to start its event handler;

To register an event handler:

1, set JavaScript object properties;

2. Set HTML Tag Properties

3, AddEventListener or attachevent (the latter is IE)

 function Addevent (target,type,handler) {
   if (target.addeventlistener) {
     Target.addeventlistener type, Handler,false);
   } else{
     target.attachevent (' On ' +type,function (event) {return Handler.call (target,event)});
   }
 

Three stages of event propagation:

1, occurs before the target processing function, is called the ' capture ' stage;

2, the object itself to deal with the event calls;

3, the bubbling stage of events;

In JavaScript, you can specify an event for an element in the following three ways :

1, in HTML, using the OnClick property
2, in JavaScript, using the OnClick property
3. In Javascipt, use the Addevenlistener () method

Comparison of three methods

(1) in the second to third method, you can pass in an event object to the function and read its corresponding property, and method one is not available.
(2) Preferred second to third, the first is not conducive to the separation of content and events, you can not use the event object related content.

Some grammatical details

(1) In the first method, the OnClick case is not relevant, but in the second method, you must use lowercase. Because HMTL is not sensitive to case, JS is case-sensitive.
(2) in the second to third method, there is no double quotation mark when specifying the function name, and the first one as an HTML property requires double quotes.
(3) The first method requires parentheses, and the second to third is not required.

 Onclick= "ClickHandler ()"
 document.getElementById ("Jsonclick"). onclick = ClickHandler2; 
 document.getElementById ("AddEventListener"). AddEventListener ("click", ClickHandler2);

Complete code:

<! DOCTYPE html> 
 
 

The above mentioned is the entire content of this article, I hope you can enjoy.