$$

From WebOS101

Jump to: navigation, search

Contents

Overview

$$ Used as a function takes any number of CSS selectors and returns an array of extended DOM elements that match. The resulting array, will be in document-order.

This utility does not rely on a browser's built-in CSS engine and as such, allows for nearly all CSS3 Selectors with the exception of pseudo-elements such as ::first-letter.

Sample Usage

A few examples of use of this utility:

Select All div tags

$$('div');

Select All Grandchildren of a Div With an ID of "container"

$$('div#container > * > *');

Select All Buttons in a WebOS Scene

$$('div.palm-button');

Once you have your array, you can iterate through it with .each() to do something with or to the items you have selected. Do not iterate with 'for...in' as the returned array is not strictly standard and has been extended by Prototype[1]. Instead use a vanilla 'for' loop or iterate with the .each() method. An example of proper iteration can be seen below.

Iterating a Returned DOM Array to Add a CSS Class to Each Item

$$('div.palm-button').each(function(item){
item.addClassName('myclass'); });

Further Reading

References

  1. http://api.prototypejs.org/language/array/
Retrieved from "http://www.webos101.com/$$"
Personal tools