faqts : Computers : Programming : Languages : JavaScript : Forms

+ Search
Add Entry AlertManage Folder Edit Entry Add page to http://del.icio.us/
Did You Find This Entry Useful?

64 of 67 people (96%) answered Yes
Recently 9 of 10 people (90%) answered Yes

Entry

What is the difference between the NAME & ID properties of an element?

Feb 22nd, 2005 23:55
jsWalter, Joe Bloggs, Lasse Nielsen, David Laub, http://www.w3.org/TR/html4/struct/links.html#h-12.2.3


In short...
IDs are unique. NAMEs are not.
PERIOD.
example...
  <input type="radio" name="gender" id="male" value="male" />Male
  <input type="radio" name="gender" id="female" value="female" />Female
the NAME of this RADIO family is GENDER, this classifies this as a 
group and the browser will automatically limit your selection to one 
or 
the other.
the ID, on the other hand, gives each button a unique identifier.
example 2...
  <input type="text" name="addrBlock" id="addr">
  <input type="text" name="addrBlock" id="city">
  <input type="text" name="addrBlock" id="state">
  <input type="text" name="addrBlock" id="zip">
This gives you 4 text boxes to enter your address
This will return a reference to the CITY text box...
   objElement = document.getElementById ('city');
This will return an array of references to all Form Elements...
   aryAddrBlock = document.getElementsByName ( 'addrBlock' );
All this gives you flexibility in how to handle form elements.
Form elements, or controls, are (for this purpose): <input>, <select>,
<textarea>, <button>, and <object> elements. On top of this, the name 
attribute is also used as a name on the <param> and <meta> elements.
The name attribute is still valid on some other elements, where it is 
used as an *anchor*, not a name. As an anchor, it should still be 
unique. On these elements, it is recommended to use the "id" 
attribute, 
and if you use both "id" and "name" (e.g., for compatability with 
Netscape 4), they *must* have identical values.
These other element are: <a>, <applet>, <form>, <frame>, <iframe>, 
<img>, and <map>.
jsWalter