Существенным моментов программирования форм является идентификация их элементов. Рассмотрите еще раз иерархическую схему объектов раздела «Объектная модель документа DOM0». Массив форм forms[] вложен в объект document; элементы форм являются вложенными объектами самой формы; элементы списка являются вложенными объектами объекта select.
Вспомним о том, что объекты JavaScript по сути представляют собой ассоциативные массивы со строковыми ключами – именами свойств.
Рассмотрим пример обращения к элементам формы из сценария. Разумеется, пример условный, в нем представлены три характерных элемента, обращение к которым из сценария принципиально различно. Точнее, по типу идентификации элементы форм можно разделить на три группы:
радиокнопки;
элементы списка;
прочие элементы форм.
Нетрудно догадаться о причинах именно такого разделения. В отличие от прочих элементов форм, группы радиокнопок и элементы списка представляют собой массивы. А массив элементов списка к тому же является вложенным по отношению к объекту select.
Пусть в документе HTML задана следующая форма (это мог бы быть фрагмент online-анкеты). Из группы «прочих элементов форм» в ней представлено однострочное текстовое поле ввода. Указаны минимально необходимые атрибуты.
<form name="f">
Ваше имя:<br>
<input type="text" name="yourName">
Ваш пол:<br>
<input type="radio" name="sex" value="male">мужской<br>
<input type="radio" name="sex" value="female">женский<p>
Город:<br>
<select name="town">
<option value="msk">Москва</option>
<option value="spb">Санкт-Петербург</option>
<option value="other">другой</option>
</select>
</form>
Во всех случаях при идентификации элементов форм используются имена (значения атрибута name) заданных элементов HTML. По имени идентифицируется и сама форма; для нашей формы это обращение
document.f
Идентификация большинства элементов формы
Группу «прочих элементов форм» в нашей форме представляет текстовое поле yourName. Варианты идентификации:
document.f.yourName
document.f['yourName']
Идентификация групп радиокнопок
В нашей форме есть группа их двух радиокнопок с именем sex. Группа радиокнопок представляет собой массив, в котором к отдельной кнопке с индексом i (индексация начинается с нуля) можно обращаться следующим образом:
document.f.sex[i]
document.f['sex'][i]
Идентификация элементов списка
В нашей форме представлен список с именем town. Его элементы представляет собой массив options[]. К элементу этого массива с индексом i (индексация начинается с нуля) можно обращаться следующим образом:
document.f.options[i]
document.f['options'][i]
Универсальная идентификация
Есть и альтернативная возможность идентификации. Все элементы формы представлены массивом elements[], в котором содержатся в порядке их объявления в документе HTML.