Html5, javascript динамічна підміна url без перезавантаження сторінки - веб-замітки і веб-підказки
Робиться це за допомогою методів pushState () або replaceState () об'єкта window.history.
приклад:
// емуляція переходу на сторінку "/page2.html" без перезавантаження сторінки
history.pushState (2, "Title 2", "/page2.html");
// заміна поточного URL на "/page3.html"
history.replaceState (3, "Title 2", "/page3.html");
За допомогою 1-го параметра функції можна ідентифікувати «стан сторінки» при переході з історії.
Наприклад: якщо відловлювати подія зміни стану сторінки (подія: «popstate»), потім зробити кілька переходів функцією «pushState». і потім натиснути кнопку «Назад». то в параметрі «state» події ми отримаємо значення цього 1-го параметра, який був переданий під час установки даної сторінки. Значення даного параметра може бути також і об'єктом.
приклад:
// Встановлюємо оброблювач події "popstate":
window.addEventListener ( 'popstate', function (event) // виводимо в консоль дані стану сторінки "event.state":
console.log ( "Page state data:", event.state);
>, False);
// емуляція переходу на сторінку "/page4.html"
history.pushState (4, "Title 4", "/page4.html");
// потім - на сторінку "/page5.html"
history.pushState (5, "Title 5", "/page5.html");
І ось якщо після виконання цього коду натиснути кнопку «Назад» у браузері, то ми отримаємо в консолі таке повідомлення:
>> Page state data: 5
З міркувань безпеки, не можна змінити доменне ім'я.
На момент написання сторінки динамічна підміна URL працювала тільки в FireFox 4 і в останніх версіях браузерів на движку WebKit (Chrome. Safari).
(На момент поновлення: вже працює в Opera)
Не дивлячись на це, даний механізм вже інтенсивно використовують в facebook.com, vkontakte.ru і інші.