The DOM Object

The DOM object has a series of methods through which you can obtain information about the document tree and manipulate it as you see fit. After capturing an object from the DOM, you will be able to run a series of methods on it. These methods are listed in Table 8-3.

Table 8-3. DOM object methods

Method

Description

.append(bunch)

Appends the objects in bunch to the end of the dom object. This method returns the concatenated dom object:

var dom = dom.append(dom.q("#APPNAME_NODEID"));

.combine(array)

Combines an array of bunches into a single bunch:

var bunch1 = dom.q("a");
var bunch2 = dom.q("p");
var combinedBunch = dom.combine([bunch1, bunch2]);

.count()

The count method run against the DOM object will always return 1.

var domCount = dom.count();

.ephemeral(bunch)

Removes all nodes set as ephemeral when:

  • The mouse button moves up.

  • The escape key is pressed.

  • Another bunch is set as ephemeral.

//set ephemeral state for all dom nodes
var parentDiv = dom.ephemeral();

.fragment()

Creates a new HTML document fragment with the intention of attaching it to the currently visible document tree. This object may be a container of nodes and will disappear once appended to the live document tree.

//create new document fragment
var fragment = dom.fragment();

.prepend(bunch)

Prepends the nodes in bunch before the first element in the DOM tree. The DOM will be provided back as the return value of the method request.

//move all images to the top of the DOM tree
var moveBunch = dom.q("img");
var newDOM ...

Get Programming Social Applications now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.

Start your free trial