Drupal 6 JavaScript and jQuery - Ebook-Cours.com

[ 91 ]
Chapter 3
$(document) creates a jQuery object that wraps the document object. The ready()
function assigns an event handler to the ready event of that object. This ready
event is a special jQuery event that fires when the DOM is ready for manipulation.
Roughly, though, it functions like the (on)load event, and should almost always be
used instead of an onload handler.
The ready() function takes a function as a parameter. Often, developers will write
an inline anonymous function to do the initialization. But we've already created an
init() function that is suitable for our needs. So all we have to do is pass in that
function object, and jQuery takes care of the rest.
But what if we have multiple scripts that need to do something when the document
is ready? Do we need to write a master function to handle all of the initialization?
No we do not. One of the nice things about jQuery's event model design is that
we can register multiple handlers for the ready event (or any other event)—and
we can even do this in different script files. So, we can use $(document).ready()
multiple times.
Now we have a tool that will rotate through sticky nodes, displaying them in order.
Using the fade effect provided by jQuery, it will smoothly transition from one sticky
node to the next. It will accomplish our goals of keeping the important information
right at the top, while not occupying too much space (and subsequently pushing
other information further down the page).
More importantly, we've gotten to see jQuery in action, providing querying tools,
DOM manipulation features, effects, and event handlers. This will lay groundwork
for later chapters.
A brief look backward
Now that we've seen the possibilities that come with jQuery, let's briefly reconsider
how we built the printer tool in Chapter 2.
To build that tool, we had to make changes within the HTML of our theme, and we
had to work with various DOM methods such as getElementById().
With jQuery, we could have skipped the template part altogether, using the ready()
function (and other jQuery event handlers) to create the printing link as the page was
created. In fact, we will do something like this in the coming chapter.
Likewise, we could probably have trimmed down the size of our script by making
use of jQuery's chaining feature.
This material is copyright and is licensed for the sole use by Richard Ostheimer on 18th June 2009
2205 hilda ave., , missoula, , 59801