Окно браузера имеет объект истории, который используется для сохранения истории просмотров.
Если текущее окно посетило три URL-адреса, то объект истории включает три элемента, а свойство History.length равно 3.
Объект истории предоставляет ряд методов, которые позволяют перемещаться между историей просмотров:
window.history.back(): переход на предыдущую посещенную страницу, что эквивалентно клавише «Назад» в браузере.
window.history.forward(): переход на следующую посещенную страницу, что эквивалентно клавише браузера «Вперед».
window.history.go(num): принимает целое число в качестве параметра и переходит на страницу, указанную этим целым числом. Например, go(1) эквивалентно методу вперед(), а метод go(-1) эквивалентен методу back(. ).
window.history.pushState(): HTML5 добавляет к объекту истории два новых метода: window.history.pushState() и window.history.replaceState(), которые используются для добавления и изменения записей в истории просмотров.
Примечание. 1. Если перемещенная позиция превышает границу истории доступа, три вышеуказанных метода не сообщают об ошибке, а не работают автоматически.
2. При настройке страница обычно загружается из кэша браузера вместо повторного запроса сервера на отправку новой веб-страницы.
Давайте сосредоточимся на: window.history.pushState().window.history.pushState(state, title, utl) создает на странице объект истории. Добавить непосредственно в историю.
Среди параметров:
состояние: объект состояния, связанный с указанным URL-адресом. При срабатывании события popstate этот объект будет передан в функцию обратного вызова. Если этот объект не нужен, здесь можно указать ноль.
title: заголовок новой страницы, но в настоящее время все браузеры игнорируют это значение, поэтому здесь можно указать ноль.
URL: новый URL-адрес должен находиться в том же домене, что и текущая страница. В адресной строке вашего браузера будет отображаться этот URL-адрес.
Примечание. Метод pushState не запускает обновление страницы, но вызывает изменение объекта истории, на что отреагирует адресная строка.
Пример реализации:Html5 прослушивает и перехватывает метод ключа возврата Android следующим образом:
1. Прослушайте событие popstate
window.addEventListener(popstate, function(){ //doSomething}, false)
2. Отмените операцию возврата по умолчанию, то есть прослушайте, чтобы перехватить ключ возврата: добавьте пустой объект истории в качестве замены исходного объекта истории.
window.history.pushState(null, null, #);
Пример:
<!DOCTYPE html><html> <meta name=viewport content=width=device-width> <script type=text/javascript> var count = 0; window.history.pushState(null, null, #); window.addEventListener (popstate, function(e) { window.history.pushState(null, null, #); document.getElementById('logView').innerHTML = Возврат кликов пользователя + (++количество) }) </script><body> <p id=logView>test</p></body></html>
Выше приведено все содержание этой статьи. Я надеюсь, что она будет полезна для изучения всеми. Я также надеюсь, что все поддержат сеть VeVb Wulin.