In this section, we’ll examine Prototype’s classes and methods for manipulating the page elements.
The
dollar function ($()
) is a specialized wrapper to the standard document.getElementById()
DOM method. Like that method, $()
returns the element with the given ID.
But unlike getElementById()
, you can pass more than one argument and $()
will return an array with all the requested elements. And if an argument is anything other than a string, it will be passed through directly. As a result, you can safely call $()
on a value multiple times. Whether the value is a string or already a DOM element, the output will be the same. For example:
// <p id="one">One</p> // <p id="two">Two</p> $('one').toString(); // => '[object HTMLParagraphElement]' $('one','two').toString(); // => [object P],[object P] $($('one')).toString(); // => [object HTMLParagraphElement]
$F(
element
)
returns the value of any
field input control, like a text box or a drop-down list. element
can be either the ID string or the element object itself.
// <input type="text" id="userName" value="Joe Doe"> // <select id="state"> // <option value="NY">New York</option> // <option value="CA" selected="selected">California</option> // </select> $F('userName'); // => "Joe Doe" $F('state'); // => "CA"
The Selector
class (and its accompanying $$()
method) allows you to reference page elements by their CSS selectors—that is, using the same syntax that you would to identify elements in a CSS file.
No credit card required