Однако важно отметить, что этого не происходит, если объект Window уже имеет свойство с таким именем. Элементы с атрибутами id, имеющими значение «history», «location» или «navigator», например, не будут доступны через глобальные переменные, потому что эти имена уже используются. Аналогично, если HTML-документ включает элемент с атрибутом id, имеющим значение «х» и в сценарии объявляется и используется глобальная переменная х, явно объявленная переменная скроет неявную переменную, ссылающуюся на элемент. Если переменная объявляется в сценарии, который в документе находится выше именованного элемента, наличие переменной будет препятствовать появлению нового свойства окна. А если переменная объявляется в сценарии, который находится ниже именованного элемента, первая же инструкция присваивания значения этой переменной затрет значение неявно созданного свойства.

В разделе 15.2 вы узнаете, что с помощью метода document.getElementByld() можно отыскивать элементы документа по значениям их HTML-атрибутов id. Взгляните на следующий пример:

var ui = ["input","prompt","heading"]; // Массив идентификаторов элементов
ui.forEach(function(id) {              // Отыскать элемент для каждого id
  ui[id] = document.getElementById(id);  // и сохранить его в свойстве
});

После выполнения этого фрагмента свойства ui.input, ui.prompt и ui.heading будут ссылаться на элементы документа. Вместо ui.input и ui.heading сценарий мог бы использовать глобальные переменные input и heading. Но, как вы помните из 14.5, объект Window имеет метод с именем prompt(), поэтому сценарий не сможет использовать глобальную переменную prompt вместо свойства ui.prompt.

Неявное использование идентификаторов элементов в качестве глобальных переменных - это пережиток истории развития веб-броузеров. Эта особенность необходима для сохранения обратной совместимости с существующими веб-страницами, но использовать ее сейчас не рекомендуется - в любой момент производители броузеров могут определить новое свойство в объекте Window, что нарушит работу любого программного кода, использующего неявно определяемое свойство с этим именем. Поиск элементов лучше выполнять явно, с помощью метода document.getElementById(). А его использование будет менее трудоемким, если дать ему более короткое имя:

var $ = function(id) { return document.getElementByld(id); };
ui.prompt = $("prompt");

Многие клиентские библиотеки определяют функцию $, которая отыскивает элементы по их идентификаторам, как в примере выше. (В главе 19 мы узнаем, что функция $ в библиотеке jQuery является универсальным методом выбора элементов, который может возвращать один или более элементов, опираясь на их идентификаторы, имена тегов, атрибут class или исходя из других критериев.)

Любой HTML-элемент с атрибутом id становится значением глобальной переменной, если значение атрибута id еще не используется объектом Window. Следующие HTML-элементы ведут себя подобным образом, если в них определен атрибут name:

<а> <applet> <area> <embed> <form> <frame> <frameset> <iframe> <img> <object>

Атрибут id элемента необходим для придания ему уникальности внутри документа: два элемента не могут иметь одинаковые значения атрибута id. Однако это не относится к атрибуту name. Если сразу несколько элементов, из перечисленных выше, будут иметь одно и то же значение атрибута name (или, если один элемент имеет атрибут name, а другой - атрибут id с тем же значением), неявно созданная глобальная переменная с этим именем будет ссылаться на объект, подобный массиву, хранящий все элементы с этим именем.

Элементы <iframe> с атрибутом name или id обрабатываются иначе. Переменная, неявно созданная для таких элементов, будет ссылаться не на объект Element, представляющий сам элемент, а наобъект Window, представляющий вложенный фрейм  созданный элементом <iframe>. К этой теме мы еще вернемся в разделе 14.8.2.

Оглавление книги