Структура документа HTML, и вобщем-то сам язык, обязывает браузер иметь некую объектную модель, с помощью которой доступ ко всем объектам был бы прост.
В JavaScript за область html документа отвечает объект document. Он также является самым главным среди всей иерархии объектов браузера, к которым Вы способны обратится посредством скрипта. Этот объект позволяет получить доступ ко всем элементам страницы, таким как формы, изображения, ссылки и т.д.
При создании страницы браузер нумерует все элементы и создает из них массив, хотя правильнее сказать такая структура предназначена для самого скрипта и облегчения работы с объектами. Давайте рассмотрим пример:
<html> <body> <img src=0.gif alt="images[0]"><br> <img src=1.gif alt="images[1]"><br> <img src=2.gif alt="images[2]"><br> <form> <input type=text> </form> <img src=3.gif alt="images[3]"><br> <form> <input type=text> </form> </body> </html>
Из всего документа браузер создает несколько массивов объектов. Вот какие эти массивы:
Каждый такой массив содержит в себе все соотвествующие элементы документа. Нумерация в массивах начинается с 0. Чтобы получить, например, доступ к самому первому изображению в документе нужно составить такое имя:
document.images[0]
В примере выше, чтобы показать какое изображение какой имеет номер я приписывал атрибут alt.
Для того, чтобы облегчить доступ к объектам в html существует атрибут тега name. Если Вы напишете так:
<img src=1.gif name=ris1 alt="images[1]">
То после такого определения тега изображения Вы сможете обращаться к изображению 1.gif двумя способами:
document.images[1] document.ris1
Как видите для простоты и мобильности правильнее будет использовать атрибут name для всех тегов, к которым впоследствии Вы планируете обращаться внутри сценариев JavaScript. Пока мы не рассматривали своства каждого из массивов и сделаем это в следующих шагах.