Программирование гипертекстовых переходов

Рассматриваются вопросы работы с коллекцией гипертекстовых ссылок и программирования гипертекстовых переходов в зависимости от условий просмотра HTML-страниц и действий пользователя.

Для начала нам нужно разделить несколько понятий: применимость URL в атрибутах HTML-контейнеров; коллекция гипертекстовых ссылок; объекты класса URL.

Адреса URL могут использоваться в атрибутах многих HTML-контейнеров, например:

· ссылки (URL в атрибуте HREF контейнера <A> );

· активные области (URL в атрибуте HREF контейнера <AREA> );

· картинки (URL в атрибуте SRC контейнера <IMG> );

· формы (URL в атрибуте ACTION контейнера <FORM> );

· внешние скрипты (URL в атрибуте SRC контейнера <SCRIPT> );

· связанные документы (URL в атрибуте HREF контейнера <LINK> ).

Гипертекстовая ссылка в HTML-документе - это область HTML-страницы, по которой можно "кликнуть" (или выбрать ее иным способом), чтобы перейти к просмотру другого HTML-документа. Из всех перечисленных выше вариантов применения URL гипертекстовыми ссылками являются лишь первые два. В объектной модели документа (DOM) они собраны в единую коллекцию гипертекстовых ссылокdocument.links[]. Нумерация в ней начинается с нуля (как обычно), в порядке появления ссылок в документе.

Обратите внимание, что в принципе могут существовать ссылки, по которым невозможно "кликнуть", т.к. они занимают нулевую площадьweb-страницы; например, контейнер <A> с пустым содержимым, т.е. <A HREF="http://ya.ru/"></A>, или контейнер <AREA>, ограничивающий фигуру нулевой площади. Тем не менее все они считаются гипертекстовыми ссылками и содержатся в коллекцииdocument.links[]. С другой стороны, в коллекцию document.links[] не попадают якоря, то есть контейнеры <A>, не имеющие атрибута HREF (якоря нужны, чтобы задать место, на которое можно сослаться из другой гиперссылки). Все контейнеры <A> (как якоря, так и гиперссылки) собраны в коллекции document.anchors[] ; в этой лекции, однако, она нас не будет интересовать.

В объектной модели документа DOM объекты класса URL имеют такие свойства, как href, protocol, hostname и т.д. (полный перечень см. ниже). В класс URL входят объекты коллекции document.links[], а также объект window.location, рассматривавшийся в"Программируем свойства окна браузера" . Конечно, помимо общих свойств, перечисленных ниже, эти объекты могут иметь свои специфичные только для них свойства, методы и события. Например, у объекта window.location есть метод reload(), тогда как у ссылок его нет, но у них есть обработчик события onClick. Мы начнем с рассмотрения объекта класса URL.

Объекты URL

Объект класса URL обладает свойствами, которые определены схемой URL. В качестве примера рассмотрим ссылку:

Тогда ее свойства примут следующие значения (обратите внимание, что значение поля search начинается со знака " ?", а значениеhash - со знака " # ")

Как Вы помните из прошлых лекций, к свойствам можно обращаться, используя точечную нотацию ( document.links[0].host ) илискобочную нотацию ( document.links[0]["host"] ). Свойства объекта класса URL дают программисту возможность менять только частьURL-адреса. Наиболее интересно это выглядит в объекте window.location, когда при изменении его свойства href происходит загрузканового документа.

Свойство href является свойством по умолчанию. Это значит, что вместо window.location.href="..." можно писатьwindow.location="...", а опуская window (который является объектом по умолчанию), можно писать location.href="..." и дажеlocation="..." - эффект будет тот же: загрузится страница с новым адресом. С этим, однако, стоит быть осторожнее, чтобы данныйоператор присваивания не находился в контексте, где объектом по умолчанию может быть какой-либо другой объект, например, внутри оператора with.

Обратите внимание, что свойства объекта URL взаимозависимы, точнее, свойство href зависит от остальных свойств, а остальные свойства зависят от href. Так, если присвоить новый URL свойству href объекта, то автоматически изменятся и все остальные свойства, разобрав данный URL на составные части. И наоборот, если, например, изменить значение свойства protocol с http: на ftp:, то изменится и значение свойства href.

Коллекция ссылок links[]

К встроенным гипертекстовым ссылкам относятся собственно ссылки ( <A HREF=...>...</A> ) и ссылки "чувствительных" графических картинок. Все вместе они составляют коллекцию (встроенный массив) гипертекстовых ссылок документа document.links[].

К сожалению, обратиться по имени к гипертекстовой ссылке (т.е. как document.имя_ссылки ) нельзя, даже несмотря на то, что у ссылки может быть задан атрибут NAME. Говоря точнее, такое обращение не рекомендуется в силу различий между браузерами. Поэтому обращаться к ним можно только через коллекцию ссылок по индексу: document.links[3] - это 4-я ссылка в документе. Стандарт также предусматривает обращение к ссылкам через коллекцию по имени: document.links["имя_ссылки"], однако это работает не во всех браузерах (в Mozilla Firefox работает, в IE7 нет). Поэтому в дальнейшем, в целях совместимости, мы будем обращаться к ссылкам через коллекцию по их индексу.

В качестве примера распечатаем гипертекстовые ссылки некоторого документа:

В результате можем получить список, например, такой:

Вставим в документ контейнер MAP с двумя ссылками, привязанными к областям (даже) нулевого размера:

И снова распечатаем массив ссылок - получим уже:

Две новые ссылки - это ссылки из контейнера MAP, который не отображается, но ссылки из него попадают в коллекцию ссылок links[]. При этом они могут попасть между обычными гипертекстовыми ссылками, если контейнер MAP расположить внутри текста документа. Итак, ссылки, создаваемые контейнерами <A HREF="..."> и <AREA HREF="...">, равноправно присутствуют в коллекцииdocument.links[].