Home > Developer > Web Develop
Binding Mechanism between DOM event model and Internet explorer event model
Different browsers such as chrome, Safari, Firefox, Opera, and Internet Explorer have their own unique event mechanisms, which are the most "alternative" for Microsoft Internet Explorer ".
Let's take the event binding method!
To ensure better cross-browser features, we recommend that you bind events unrelated to browsers.
Bind HTML element attributes
This event binding method is easy to use, such as <form method = "get" handler (this) ">.
When binding event processors, You Need To directly modify the HTML page code, which brings the following Disadvantages:
Modifying HTML element attributes directly increases the complexity of page logic.
Developers need to directly modify HTML pages, which is not conducive to collaborative development.
However, parameters can be passed in when javaScript Functions are called. Typically, parameters with special meanings such as this and event are passed in.
Bind DOM object attributes
Document. forms [n]. onsubmit = check;
When bound to a DOM object property, this property value is only a reference to a javaScript function. Therefore, do not add brackets behind the function. Once parentheses are added, this function is called, therefore, the return value of this function is assigned to the onclick and other attributes of the DOM object.
The event binding mechanism provided in the event mechanism of the DOM Model
ObjectTarget. addEventListener ("eventType", handle, captureFlag) binds the event handler to objectTarget. The first parameter is that the event type string removes the prefix of the previous event attribute "on ", for example, click, mousedown, keypress, etc.); the second parameter is the event processing function; the third parameter is used to specify the stage of event propagation. true indicates the listening capture stage, false indicates the listening bubble stage ).
<Html>Corresponds to the addEventListener () method. DOM also improves the method used to delete the event processor, which is removeEventListener.
ObjectTarget. removeEventListener ("eventType", handler, captureFlag)
This method is objectTarget to delete the event processor handler.
Internet explorer supports two unique event binding methods. Both methods do not need to add additional attributes to the HTML element.
In internet explorer 4.0 and later versions, microsoft extends the <script> element to bind the script containing the script statement to an event type of an element. The two attributes for binding are for and event.
The value of the For Attribute must be the id attribute value of an element in the HTML document. This attribute uniquely identifies this HTML element. The Event property value is the Event name supported by this element, such as onmouseover and onclick. Once these two attributes are specified for the script tag, it indicates that all scripts in the tag are bound to the corresponding events of the element.
Note: In this binding mechanism, the script statement for event processing is not in the function, but in the <script> element.
<Html>Bind the attachEvent Method
DOMObject. attachEvent "eventName", functionReference)
The value of eventName is the name of the event, for example, onmousedown; the value of functionReference is a function reference.
<Html>Generally, a DOM object and an event can only be bound to one event processor. However, when the attachEvent () method is bound to an event processor, one DOM object and one event can be bound to multiple event processors.
The attachEvent () method corresponds to the detachEvent () method, which is used to delete an event processor.
DOMObject. detachEvent ("eventName", functionReference );
This article is from the singsong blog, please be sure to keep this source http://singsong.blog.51cto.com/2982804/1266803
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
