Markup Languages: More Than HTML5 - Web Standards: Mastering HTML5, CSS3, and XML - page 85

The accesskey , class , dir , id , lang , style , tabindex , and title attributes can also be used in HTML 4.
Event Handlers
The interactivity of web sites is achieved by checking whether an element received focus, a key is pressed, the user
touched the touchscreen, and so forth. When such an event occurs, the script declared as the attribute value of the
event handler attribute is executed. The name of event handlers starts with on and is followed by the name of the
corresponding event ( onclick , onkeypress , etc.).
When an HTML or XHTML document is loaded into a web browser, it becomes a Document object. An open
browser window can be represented by the Window object. Some event handlers can be applied not only to markup
elements, but also to the Document or Window objects.
Event handlers can be used as content attributes (markup element attributes and some event handlers on the
Window object, Listing 3-28), Interface Definition Language (IDL) attributes [42] (scripting attributes, common to all
event handlers, Listing 3-29), or both.
Listing 3-28. Content Attributes in the Markup
<div id="stunning" class="decoration"><p>...</p></div>
Listing 3-29. IDL Attributes in Scripting (Sets the Same Value as the class Attribute in Listing 3-28)
document.getElementById('stunning').className='decoration'
The following example demonstrates a simple onclick event handler (Listing 3-30).
Listing 3-30. A Button That Displays the Current Time When the User Clicks on It
<p>Click the button to display the date.</p>
<p><button onclick="displayDate()">What's the time?</button></p>
<script>
function displayDate() {
document.getElementById("demo").innerHTML = Date();
}
</script>
<p id="demo"></p>
Global Event Handlers
The event handlers that are supported by all HTML5 elements (as both event handler content attributes and event
handler IDL attributes) as well as by all Document and Window objects (as event handler IDL attributes) are the
keyboard event handlers, the mouse event handlers, the media event handlers, the form event handlers, and the
document event handlers.