What's New in Prototype 1.5?
by Scott Raymond | Pages: 1, 2, 3, 4, 5

The 1.5 release brought a ton of new methods to Element.Methods:

• replace(html) is a cross-browser implementation of the outerHTML property; replaces the entire element (including its start and end tags) with html. For example:

  $('target').replace('<p>Hello</p>');

• toggleClassName(className) adds or removes the class className to/from the element. For example:

  $('target').toggleClassName('active');

• getWidth() returns the width of the element in pixels. For example:

  $('target').getWidth();

• getElementsByClassName(className) returns an array of all descendants of the element that have the class className. For example:

  $('target').getElementsByClassName('foo');

• getElementsBySelector(expression1[, expression2 [...]) returns an array of all descendants of the element that match any of the given CSS selector expressions. For example:

  $('target').getElementsBySelector('.foo');
$('target').getElementsBySelector('li.foo', 'p.bar');

• childOf(ancestor) returns true when the element is a child of ancestor. For example:

  $('target').childOf($('bar')); // => false

• inspect() returns a string representation of the element useful for debugging, including its name, id, and classes. For example:

  $('target').inspect(); // => '<div id="target">'

• ancestors(), descendants(), previousSiblings(), nextSiblings(), and siblings() return arrays of related elements. For example:

  $('target').ancestors();
$('target').descendants();
$('target').previousSiblings();
$('target').nextSiblings();
$('target').siblings();

• immediateDescendants() returns an array of the element's child nodes without text nodes. For example:

  $('target').immediateDescendants();

• up([expression[, index]]) returns the first ancestor of the element that optionally matches the CSS selector expression. If index is given, it returns the nth matching element.

  $('target').up();
$('target').up(1);
$('target').up('li');
$('target').up('li', 1);

• down([expression[, index]]) returns the first child of the element that optionally matches the CSS selector expression. If index is given, it returns the nth matching element.

  $('target').down();
$('target').down(1);
$('target').down('li');
$('target').down('li', 1);

• previous([expression[, index]]) returns the previous sibling of the element that optionally matches the CSS selector expression. If index is given, it returns the nth matching element.

  $('target').previous();
$('target').previous(1);
$('target').previous('li');
$('target').previous('li', 1);

• next([expression[, index]]) returns the next sibling of the element that optionally matches the CSS selector expression. If index is given, it returns the nth matching element.

  $('target').next();
$('target').next(1);
$('target').next('li');
$('target').next('li', 1);

Pages: 1, 2, 3, 4, 5

Next Page