CHAPTER 6 DECOUPLED (Web hosting compare) NAVIGATION PATTERN 171 is

CHAPTER 6 DECOUPLED NAVIGATION PATTERN 171 is generated and the element captures it. Consider the following example that illustrates how to capture an event by using a property to wire the event: function DoAssociation() (document.getElementById( “manualassociation”))[ ‘onclick’] = MonitorLinksId; document.getElementById( “manualassociation”).attachEvent( ‘onclick’, MonitorLinksId); } In the example, the wiring of the methods to an HTML element should happen in the HTML element bodyonload event. It is important that only when the onload event is being fired that the events can be wired. If the wiring occurs before the document has been loaded, some HTML elements might not exist and cannot be referenced. The onload event ensures that the HTML content has been loaded and can be referenced. After the method DoAssociation is called, there are two ways to wire an event to an HTML element. In either way, it is important to call the document.getElementById method to retrieve an HTML element instance. The first way to assign an event is to assign the array index of the event that is to be wired. In the example, that means assigning the onclick array index. This assignment illustrates a fundamental feature of JavaScript: there are no differences made between properties, functions, E B V N and so on. The second way to assign an event is to use the method attachEvent (as illustrated) or addEventListener. When calling the methods attachEvent or addEventListener, you will need two parameters. The first parameter is the event to be captured, and the second parameter is the function to be associated with the event. In both cases, it is not necessary to use function variables or identifiers, because an anonymous function would be acceptable. You would use attachEvent with Microsoft Internet Explorer, and addEventListener when using a Mozillabased or Safari browser. The advantage of using the array index approach is that it works on all browsers without any special requirements. However, it works because it is a special case of how the JavaScript language is constructed. The official approved way would be to use either addEventListeneror attachEvent. After the events have been wired, they will function identically to the MonitorLinks function of previous examples. If you do not want to associate the event to the HTML element in the bodyonload event, it can be done after the element has been declared, as illustrated by the following source code: