Sign in

.select()

Selects elements from the document based on a CSS-style selector string, an Array or a single supplied argument.

Syntax

neon.select(string selector)
neon.select(Array elements)
neon.select(DOMDocument document | DOMElement element | Window window)

selector

A string containing a CSS-style selector string. Multiple selectors may be contained in the same string, separated by commas:

// select both ul and ol elements in the header
lists = neon.select("#header ul, #header ol");

elements

Alternatively, this method accepts an Array containing zero or more DOM elements or other objects.

While it's possible to supply objects of any type within the Array, Neon's built-in methods will usually expect the selected objects to be DOM elements, and their behaviour may be undefined otherwise.

document | element | window

It is also possible to supply a single DOM document, DOM element or Window object to this method.

Return value

This method is chainable.

This method returns a Neon object with the given elements (or other objects) selected. The return object may be used like an Array, having a length property. The selected objects may be accessed using numeric properties.

Description

Many of Neon's methods are designed to work on a selection of DOM elements. This selection can be specified using the .select() method.

This method returns an Array-like object containing the elements (or other objects) specified in its arguments. This object can be treated like a normal Array (including a length property), and therefore the return value can be used in most contexts which require an Array of elements.

// Get a list of images in the document
imagelist = neon.select('img');

alert("There are " + imagelist.length + " images in the document.");

As well as acting like an Array, however, the returned object is also derived from the Neon object, and inherits all of the Neon object's methods. This allows for method chaining:

// Change the color of list items to red
neon.select("#mymenu ul li").style('color', 'red');

Method chaining allows you to perform many operations on the list of returned elements on a single line, without using any temporary variables. In the above example, the method .select() is called, which returns a Neon object containing list items from the document. Then, the .style() method is run on the resulting object. Since .style() also supports chaining, further methods can be added afterward.

How method chaining works

Method chaining is a technique where multiple methods can be used in sequence, separated by dots:

// Hypothetical example of method chaining
object.methodone().methodtwo().methodthree();

A method is said to allow chaining if it returns an object which itself has methods. Neon methods which allow chaining return a copy of, or an object derived from, the same Neon object. Therefore, any Neon method which allows chaining may have any other Neon method chained to the end of it.

Many Neon methods are designed to be run on a Neon object which contains a selection of DOM elements, thus .select() is often needed at the beginning of a chain of Neon methods.