tailieunhanh - Học JavaScript qua ví dụ part 76

Thêm một sự kiện Các addEventListener Phương. Mô hình sự kiện W3C thêm addEventListener () phương pháp, trong đó đăng ký một người biết lắng nghe sự kiện duy nhất trên một tài liệu, một cửa sổ, nút một DOM hoặc X (HTML), hoặc một XMLHttpRequest Ajax (xem Chương 18, "Giới thiệu về Ajax (với JSON ) "). | 668 Chapter 15 The W3C DOM and JavaScript Figure Further bubbling stops after a user clicks the link. Event Listeners with the W3C Model Adding an Event The addEventListener Method. The W3C event model adds the addEventLis-tenerO method which registers a single event listener on a document a window a DOM node or X HTML or an Ajax XMLHttpRequest see Chapter 18 An Introduction to Ajax with JSON . This method takes three arguments 1. The event type to listen for mouseover click etc. . 2. A function to be executed when the event is fired. 3. A Boolean called useCapture of true or false to specify the event propagation type true to turn on event capturing and false to turn on event bubbling the most cross-browser-compliant way is false . FORMAT type listener useCapture EXAMPLE var div1 mydiv click sayWelcome false From the Library of Event Listeners with the W3C Model 669 You can register more than one event for a target if the events or capture parameters are different. Now we register another event listener to the same element as follows var divl mydiv click bigFont false click smallFont true So which event takes place first The W3C model does not state which event handler is fired first so we will check in Example . However if multiple identical event listeners are registered on the same target with the same parameters the event listener will only be called once and the duplicate instances discarded. Using this within the Handler. As we have seen in many examples throughout this text the this keyword normally represents a reference to an object passed to a function but the this keyword when used with W3C event handlers is a reference to the HTML element from which the event handler was fired giving you easy access to the element. function changeStyle cc0000 EXAMPLE