# Dom.js

Css Query related function and Element extensions

#### Dependencies

Moo.js, Function.js, Array.js, String.js, Element.js

#### Author

Valerio Proietti, http://mad4milk.net

#### License

MIT-style license.

Summary

Dom.js | Css Query related function and Element extensions
Utility Functions |
Functions |
$S() | Selects DOM elements based on css selector(s).
$$ | Same as $S
$E | Selects a single (i.e.
$ES | Returns a collection of Elements that match the selector passed in limited to the scope of the optional filter.
Element | Custom class to allow all of its methods to be used with any DOM element via the dollar function $.
Properties |
getElements | Gets all the elements within an element that match the given (single) selector.
getElement | Same as Element.getElements, but returns only the first.
getElement | Same as Element.getElements, but allows for comma separated selectors, as in css.
document related functions |
Functions |
document. getElementsByClassName | Returns all the elements that match a specific class name.
Elements | Methods for dom queries arrays, as $S.
Properties |
action | Applies the supplied actions collection to each Element in the collection.

## Utility Functions

Summary

Functions |
$S() | Selects DOM elements based on css selector(s).
$$ | Same as $S
$E | Selects a single (i.e.
$ES | Returns a collection of Elements that match the selector passed in limited to the scope of the optional filter.

### Functions

### $S()

> function $S()

Selects DOM elements based on css selector(s). Extends the elements upon matching.

#### Arguments

any number of css selectors

#### Example

>     $S('a') //an array of all anchor tags on the page
>     $S('a', 'b') //an array of all anchor and bold tags on the page
>     $S('#myElement') //array containing only the element with id = myElement
>     $S('#myElement a.myClass') //an array of all anchor tags with the class "myClass" within the DOM element with id "myElement"

#### Returns

array | array of all the dom elements matched

### $$

Same as $S

### $E

> function $E( | selector,
> | filter | )

Selects a single (i.e. the first found) Element based on the selector passed in and an optional filter element.

#### Arguments

selector | the css selector to match
filter | optional; a DOM element to limit the scope of the selector match; defaults to document.

#### Example

>     $E('a', 'myElement') //find the first anchor tag inside the DOM element with id 'myElement'

#### Returns

a DOM element | the first element that matches the selector

### $ES

> function $ES( | selector,
> | filter | )

Returns a collection of Elements that match the selector passed in limited to the scope of the optional filter. See Also: Element.getElements for an alternate syntax.

#### Retunrs

array | an array of dom elements that match the selector within the filter

#### Arguments

selector | css selector to match
filter | optional; a DOM element to limit the scope of the selector match; defaults to document.

#### Examples

>     $ES("a") //gets all the anchor tags; synonymous with $S("a")
>     $ES('a','myElement') //get all the anchor tags within $('myElement')

## Element

Custom class to allow all of its methods to be used with any DOM element via the dollar function $.

Summary

Properties |
getElements | Gets all the elements within an element that match the given (single) selector.
getElement | Same as Element.getElements, but returns only the first.
getElement | Same as Element.getElements, but allows for comma separated selectors, as in css.

### Properties

### getElements

Gets all the elements within an element that match the given (single) selector.

#### Arguments

selector | the css selector to match

#### Example

>     $('myElement').getElements('a'); // get all anchors within myElement

#### Credits

Say thanks to Christophe Beyls http://digitalia.be for the new regular expression that rules getElements, a big step forward in terms of speed.

### getElement

Same as Element.getElements, but returns only the first. Alternate syntax for $E, where filter is the Element.

### getElement

Same as Element.getElements, but allows for comma separated selectors, as in css. Alternate syntax for $S, where filter is the Element.

## document related functions

Summary

Functions |
document. getElementsByClassName | Returns all the elements that match a specific class name.

### Functions

### document. getElementsByClassName

Returns all the elements that match a specific class name. Here for compatibility purposes. can also be written: document.getElements(‘.className’), or $S(‘.className’)

## Elements

Methods for dom queries arrays, as $S.

Summary

Properties |
action | Applies the supplied actions collection to each Element in the collection.

### Properties

### action

Applies the supplied actions collection to each Element in the collection.

#### Arguments

actions | an Object with key/value pairs for the actions to apply. The initialize key is executed immediatly. Keys beginning with on will add a simple event (onclick for example). Keys ending with event will add an event with Element.addEvent. Other keys are useless.

#### Example

>     $S('a').action({
>        initialize: function() {
>            this.addClassName("anchor");
>        },
>        onclick: function(){
>            alert('clicked!');
>        },
>        mouseoverevent: function(){
>            alert('mouseovered!');
>        }
>     });

> function $( | el | )

returns the element passed in with all the Element prototypes applied.
Custom class to allow all of its methods to be used with any DOM element via the dollar function $.

> function $S()

Selects DOM elements based on css selector(s).

> function $E( | selector,
> | filter | )

Selects a single (i.e.

> function $ES( | selector,
> | filter | )

Returns a collection of Elements that match the selector passed in limited to the scope of the optional filter.
Gets all the elements within an element that match the given (single) selector.
My Object Oriented javascript.
Contains Function prototypes, utility functions and Chain.

> function $A( | array | )

Copy the array and returns it.
Same as Array.copy, but as function.
Contains Array prototypes and the function $A;
Contains String prototypes and Number prototypes.
Contains useful Element prototypes, to be used with the dollar function $.
Attaches an event listener to a DOM element.