HistoryオブジェクトにpushState()とreplaceState()というメソッドが追加されました。
pushStateというのは、
Historyのリストに新しくエントリを追加してしまいます。
ページ遷移をしていなにのに、Hisotryが追加されるのです。
下記にコードを示します。
<html>
<head>
<script>
function push_history() {
history.pushState("", "", "/example");
}
</script>
</head>
<body>
Hello, World!
<form>
<input type="button" value="button" onclick="push_history()" />
</body>
</html>
これにより、
現在のページが "http://foo.com/hello/index.html " だった場合、
ボタンをクリックするとURLが第3引数により、"http://foo.com/example" に変化しており、
戻るのリストをみると、１個Historyが追加されているのがわかります。
実際に戻るをクリックすると、URLバーが
"http://foo.com/hello/index.html "
に戻ります。
これで、ページを遷移していないのに、
Historyにエントリを追加して、URLを変更することができます。
Ajaxとこれを組み合わせた技術を "Pjax" と呼びますが、
これは別途まとめようと思います。
投稿
0 件のコメント:
コメントを投稿