Clicking the document will use Dom's getElementsByClassName
method to collect all of the elements with the class bar
applied.
getElementsByClassName
, part of the YUI Dom Collection, makes it easy to collect elements that have a given className
applied.
To illustrate the use of getElementsByClassName
, we'll create a number of <div>
s with various combinations of classNames applied. When the document is clicked, we will collect all of the elements that have the className
bar
.
Add with some markup for the demo elements, including a button to trigger the demo:
Now we will define the function that collects the elements with the className
of bar
present. The first argument of the getElementsByClassName
method is the className
we are searching for. The second argument is an optional tagName
, which will make the search much quicker. The third argument is an optional ID of an HTMLElement, or an actual HTMLElement object to use as the root node to start from.
To trigger the demo, we will use the YUI Event Utility's on
method to listen for clicks on the button.
This is a simple example of how to use the YAHOO.util.Dom.getElementsByClassName
method. Keep in mind that the optional arguments should be used whenever possible to maximize the performance of the search.
Note: You are viewing this example in debug mode with logging enabled. This can significantly slow performance.
Copyright © 2008 Yahoo! Inc. All rights reserved.
Privacy Policy - Terms of Service - Copyright Policy - Job Openings