JS Operation Dom dynamically add and remove events

Note that event names do not take on, such as onclick as click, under IE

Add event: Dom object. AddEventListener (' event name ', function name, true/false);

Delete Event: Dom object. RemoveEventListener (' event name ', function name, true/false);

The third parameter is Usecapture, and if true, the browser uses capture interception to handle the sequence of events, and if False, the browser handles the sequence of events in bubbing bubbling mode

is generally false

To give an example, you can modify the true or false to see the effect:

<!DOCTYPE HTML PUBLIC "-//w3c//dtd HTML 4.01 transitional//en" "Http://www.w3.org/TR/html4/loose.dtd "><HTML><Head>    <title></title>    <Metahttp-equiv= "Content-type"content= "text/html; charset=utf-8"/></Head><Body><DivID= "Div_test">div_test<inputtype= "button"ID= "Btn_test"value= "Btn_test"/></Div><Scripttype= "Text/javascript">window.onload= function() {document.getElementById ("div_test"). AddEventListener ("Click", Test1,false); document.getElementById ("btn_test"). AddEventListener ("Click", Test2,false); }    functiontest1 () {alert ("Outer DIV Trigger")    }    functiontest2 () {alert ("Inner input trigger")    }</Script></Body></HTML>

Example

IE, the event name can not go on, normal write

Add event: Dom object. Attachevent (' event name ', function name);

Delete Event: Dom object. DetachEvent (' event name ', function name);

Note that the function names that bind and delete events must be the same, and anonymous functions cannot be used, and anonymous functions cannot specify function names

Common code is as follows:

//Binding Eventsif(typeofDocument.addeventlistener! = "undefined") {Document.addeventlistener ("MouseDown", _lhlclick,true); } Else{document.attachevent ("OnMouseDown", _lhlclick); } //Unbind Eventif(typeofDocument.addeventlistener! = "undefined") {Document.removeeventlistener ("MouseDown", _lhlclick,true); } Else{document.detachevent ("OnMouseDown", _lhlclick); } 

binding and unblocking events

JS Operation Dom dynamically add and remove events