On Apr 18, 4:46 am, Doug Reeder <reeder...@gmail.com> wrote:
> Is there a list of which DOM properties and methods are useful when using
> Prototype, and which are unnecessary, given the availability of Prototype
> methods?

It is not so much what is necessary or not, but what might be an
appropriate situation to use one or the other.  For example, the
Prototype.js Form object has a reset method:

var Form = {
  reset: function(form) {
    return form;

Which would be called as:


It just calls the Form's reset method and returns a reference to the
form.  It might be used for cases where calls are chained (which means
the code is marginally shorter but it makes debugging more difficult)
so you might use:

  var stuff = Form.reset('someForm').serialize();

if you wanted to serialize a form using its default values. If you
just want to reset the form (which is likely what you want to do in
99.9% of cases), then use:


which uses the browser supplied reset method directly.

Similarly with focus(), you'd need to use:


It seems that it would be rarely used in place of just:


which uses the browser's focus method directly.  If you pass some
element to the above that doesn't support reset or focus, you may get
an error. e.g. option elements are form controls (and therefore might
be considered safe to use the Form.Element methods) but do not have an
HTML onfocus attribute or DOM focus method, so calling:


may error in conforming browsers, Prototype.js doesn't provide any
protection against that.

There may be reasons to use one or the other that are applicable to
certain situations - which one you chose depends on the circumstance.
What you may discover are the foibles that remain in Prototype.js's
handling of cross-browser issues, since that is the primary motivation
for replacing the browser version of DOM methods.

For example, the value of a select-one select element should be the
value of the selected option.  The value of an option element is the
value of the value attribute or, if it is not specified, the value of
the text content.  However, IE gets it wrong - if the value isn't
specified, it doesn't return the text value.  So given a select
element like:

   <select name="sel0" id="sel0">
     <option selected>one

 if you use:

  var theValue = $('sel0').getValue();

you will get the correct value in IE, however if you use:

  var theValue = $('sel0').value;

IE will return an empty string.  Not exactly what you asked (it uses a
Prototype.js method instead of accessing the property directly, rather
than a straight replacement of a DOM method) but I think it
illustrates the point.

You received this message because you are subscribed to the Google Groups 
"Prototype & script.aculo.us" group.
To post to this group, send email to prototype-scriptaculous@googlegroups.com
To unsubscribe from this group, send email to 
For more options, visit this group at 

Reply via email to