Rule #8: Name page objects and call user events with the only all-browser compatible technique.

Web pages are a salad of different scripting languages talking to each other. The HTML, JavaScript, and Cascading Stylesheets are glued together by two main devices, Object IDs and Events. These devices are not implemented consistently from browser to browser.

Naming Document Objects

HTML page elements are loaded into the web browser's memory as document objects if they are assigned unique names in the markup. You have to do this if you plan to manipulate them with JavaScript or, sometimes, format them with CSS. Forms and form elements also need unique names in order to send their data to a web server. Two attributes, name and id, are used to accomplish naming under different circumstances. Forget about the reasons, always give an object both a name and an id with the same value.

<input type="radio" name="MyInput1" id="MyInput1" value="Internal">

Calling JavaScript Events

JavaScript events triggered by mouse handling can be called many ways. There are only a few techniques that work with all browser/operating system combinations.

For images and hyperlinks, always put the event handler in an <a> tag, never directly in the <img>, <span>, <div> or other page element.

<a name="MyHandler1" id="MyHandler1" href="#" onclick=" MyEvent();return false">

<a name="MyHandler1" id="MyHandler1" href="


              javascript;" onclick="
              MyEvent()">