Объект history

  




  

Прием в авторские монографии до 20 марта 2016 г.

Для получения информации о работе Web-обозревателя используется дочерний объект объекта window – history.

Этот объект содержит сведения о страницах, которые отображались и отображаются в окне обозревателя, а также содержит методы перехода к ним. Работу с некоторыми методами и свойствами этого объекта рассмотрим на примере. Histiry\Index.html

Как видно, первая индексная страница данного примера содержит две кнопки, нажатие на которые вызывает две соответствующие функции: <script>
F.innerHTML='Длина истории обозревателя '+history.length
function go()
{history.forward();}
function Go3()
{history.go(3);}
</script>
<input type="button" value="Следующий" onclick="go()">
<input type="button" value="Перейти на 3 позиции" onclick="Go3()">

Из кода видно, что в объект с именем F выводиться длина истории обозревателя. Это делается с помощью свойства Length объекта location. Данное свойство возвращает длину списка истории. Так при первом открытии данной страницы, список истории ещё пуст, поэтому данное свойство вернёт значение 0.

Вернёмся к функциям. Функция Go() использует метод forward объекта history. Этот метод загружает в окно обозревателя следующий документ из списка истории. При первоначальной загрузке странице, как мы уже отмечали, список истории пуст, поэтому вызов этой функции (а следовательно и метода) не приведёт к загрузке какого либо документа. В силу тех же причин кнопка обозревателя «вперёд» недоступна.

Следующая кнопка вызывает функцию Go3(). В ней используется метод go() с параметром 3. Вызов данного метода с параметром 3 приведёт к загрузке документа стоящего на третьей позиции в списке истории от текущего. Так как, список истории пуст, то загрузки документа не произойдёт.

В документе присутствует гиперссылка, которая ведёт на документ 1. Воспользуемся этой гиперссылкой для загрузки документа 1.

В документе 1 также используется свойство length, которое вернёт значение 1, т.е. в списке истории содержится один документ, тот который был просмотрен прежде, т.е. индексная страница. Документ_1 является текущим. Для наглядности, изобразим список истории в следующем виде:
Индексная страница
Документ_1

Жирным курсивом выделен текущий документ. Следует отметить, что текущий документ не учитывается свойством length объекта history. Таки образом, несмотря на то, что в таблице два документа, свойство length вернёт только количество просмотренных документов, т.е. 1.

Итак, документ_1 содержит три кнопки: «вперёд», «назад» и «перейти на три позиции», нажатие на которых связано с тремя функциями next(), prev() и go3() соответственно: <script>
F.innerHTML='Длина истории обозревателя '+history.length;
function Next()
{ history.forward() ;}
function Go3()
{history.go(3);}
function prev()
{history.back();
</script>
<br>
<input type="button" value="Вперёд" onclick="Next()">
<br>
<input type="button" value="Перейти на 3 позиции вперёд" onclick="Go3()">
<br>
<input type="button" value="Назад" onclick="prev()">

Функция next() использует знакомый уже метод forward(). Список истории уже не пуст, но текущий документ в нём расположен на последнем месте, поэтому переход на следующий документ невозможен, т.к. следующий документ просто не определён.

Функция Go3() также осуществляет вызов метода go(3). Переход на три позиции вперёд невозможен, потому что текущий документ в списке истории последний.

Кнопка «Назад» вызывает функцию prev(). В ней используется метод back() объекта history. Данный метод загружает предыдущий документ из списка истории. Предыдущий документ вполне определён (это индексная страница), поэтому при нажатии на эту кнопку он будет загружен.

Заметим, что список истории изменился на 1, и его длина стала равной 2. Это был добавлен просмотренный ранее документ_1. Текущим стал документ индексная страница.
Индексная страница
Документ_1

Теперь, в силу того, что текущий документ в списке истории не последний, то мы можем вполне использовать метод forward(). Для этого нажмём кнопку «Следующий». Будет загружен следующий в списке истории документ, т.е. документ_1. Он станет текущим.
Индексная страница
Документ_1

Заметим, что размер списка истории не изменился, т.к. был осуществлён просто переход к уже ранее записанному в него документу. С этого документа можно перейти только назад, используем для этого кнопку «Назад». Переход будет осуществлён, благодаря работе метода back().
Индексная страница
Документ_1

Так как был осуществлён просто переход на уже записанный в историю документ, то размер списка истории не изменился.

Воспользуемся снова гиперссылкой для перехода на документ_1. Список истории стал равен 1. Это произошло потому, что ранее записанный в историю документ_1, из того, что снова был загружен стал текущим. Поэтому единственным в списке истории остался предыдущий индексный документ.

Воспользуемся расположенной на текущем документе_1 гиперссылкой, которая ведёт на документ_2. Как и следовало ожидать, список истории увеличился на 1. История теперь состоит из индексного документа и документа_1, документ_2 является текущим и в список истории ещё не записан.
Индексная страница
Документ_1
Документ_2

Документ_2 содержит аналогичные кнопки, которые связаны с теми же функциями, что и в документе_1. Поэтому описывать их снова не имеет смысла. Отметим, что теперь вполне возможно использовать для перехода на предыдущие в списке истории документы, кнопку «Назад» (метод Back()).

Но мы перейдём на документ_3, используя расположенную в текущем документе гиперссылку. Как и следовало ожидать, список истории увеличился на 1 и стал равным 3. Документ_3 текущий, но ещё не записанный в историю.
Индексная страница
Документ_1
Документ_2
Документ_3

Теперь список истории содержит три записи, и казалось бы, что можно осуществлять переход на три позиции, но это не совсем так. Возможно осуществлять переход на три позиции, относительно позиции текущего документа. А текущий документ имеет последнюю позицию, поэтому переход вниз на три позиции невозможен, а следовательно использование метода go(3) ни к чему не приведёт. Но возможно использование метода go(-3), т.е. с параметром -3. Результатом выполнения данного метода будет загрузка документа, расположенного на три позиции выше позиции текущего документа. Для этого и предназначена кнопка «Назад на три позиции». function prev()

{ history.go(-3);}
</script>

<br>
<input type="button" value="Назад на три позиции" onclick="prev()">

Нажав на эту кнопку, мы переёдём на три позиции выше в списке истории, т.е. будет загружен документ «Индексная страница». При этом список истории увеличится на 1 и станет равным 4.
Индексная страница
Документ_1
Документ_2
Документ_3

Перейти с этого документа на три позиции вниз мы можем (т.к. минимум три документа в списке истории определены ниже), мы попадём на документ_3. Это произойдёт при нажатии кнопки «перейти на 3 позиции», которая использует метод go(3).

Очевидно, что метод history.go(-1) эквивалентен методу history.back, а метод history.go(1) аналогичен методу history.forward().

Таким образом, мы познакомились с основными методами и свойствами объекта history.

Напоследок, следует сказать, что в некоторой литературе (например [1] )метод Go(приращение) указан как метод, который поддерживается только обозревателем Navigator, но он прекрасно работал в обозревателе InternetExplorer версии 6.0.

  

Rambler's Top100

  

Кравец Вера Владимировна
Главный редактор
vkravets@vsi.ru
vkravets@naukapro.ru

  
Кравец Вера Владимировна
vkravets@naukapro.ru

Спасибо за проявленный интерес!
Все права защищены. Copyright © 2006-2020. Вера Кравец.