HTML and CSS Reference
In-Depth Information
8.1.1
]
[
Style Classes, 8.3
] [
JavaScript Event Handlers, 12.3.3
]
12.3.3. JavaScript Event Handlers
One of the most important features JavaScript provides is the ability to
detect and react to events that occur while a document is loading, ren-
dering, and being browsed by the user. The JavaScript code that handles
these events may be placed within the
<script>
tag, but more com-
monly, it is associated with a specific tag via one or more special tag
attributes.
For example, you might want to invoke a JavaScript function when the
user passes the mouse over a hyperlink in a document. The JavaScript-
aware browsers support a special "mouse over" event-handler attribute
for the
<a>
tag, called
onMouseOver
, to do just that:
<a href="doc.html" onMouseOver="status='Click me!';
return true">
When the mouse passes over this example link, the browser executes
the JavaScript statements. (Notice that the two JavaScript statements
are enclosed in quotes and separated by a semicolon, and that single
quotes surround the text-message portion of the first statement.)
While a complete explanation of this code is beyond our scope, the
net result is that the browser places the message "Click me!" in the
status bar of the browser window. Commonly, authors use this simple
JavaScript function to display a more descriptive explanation of a hy-
perlink, in place of the often cryptic URL that the browser traditionally
displays in the status window.
HTML and XHTML both support a rich set of event handlers through re-
lated
on
-event tag attributes. The value of any of the JavaScript event-
handler attributes is a quoted string containing one or more JavaScript
statements separated by semicolons. If necessary, you can break ex-
