Head First HTML with CSS

#5 Client-side Scripting
HTML pages don’t have to be passive documents; they can also have content that is executable.
Executable content gives your pages behavior. You create executable content by writing
programs or scripts using a scripting language. While there are a quite a few scripting
languages that work with browsers, JavaScript is the reigning king. Here’s a little taste of what it
means to put executable content into your pages.
function validBid(form) {
if (form.bid.value > 0) return true;
else return false;
}
Here’s a new HTML element,
, which allows you to write
code right inside of HTML. Notice
we’ve set the type to JavaScript.
And here’s a bit of JavaScript script
that checks a user’s bid to make sure
it’s not zero dollars or less.
Then in XHTML, you can create a form that uses this script to check the bid before the
form is submitted. If the bid is more than zero, the form gets submitted.
Here’s a new attribute in the form
called onsubmit that invokes a script
when the submit button is pressed.
What else can scripting do?
As you see above, form input validation is a common and useful task that is often done with
JavaScript (and the types of validation you can do go far beyond this example). But that’s just
the beginning of what you can do with JavaScript. JavaScript actually has access to the entire
document tree of elements (the same element tree you worked with in Chapter 3) and can
programatically change values and elements in the tree. What does that mean? It means you
can have a script change various aspects of your Web page based on a user’s actions. Here
are a few things you might do with JavaScript:
n
n
n
n
n
n
Create an interactive game, like a crossword puzzle.
Dynamically change images as the user passes their
mouse over the image.
Set local information in the user’s browser so you can
remember them next time they visit.
Let users choose between different stylings of a page.
Display a random quote from a set of quotes.
Display the number of shopping days before Christmas.
leftovers
you are here 645