web-dev-qa-db-ja.com

ハッシュやページの再読み込みをせずに新しいURLでアドレスバーを更新する

私は、ページをリロードせずにjavascript（パスではなくパス）を介してアドレスバーを更新する方法を実装するchrome（dev channel）を夢見ていたか、実際にこれを行っています。

しかし、私が読んだ記事Ithinkが見つかりません。

私は夢中ですか、それとも（Chromeで）これを行う方法はありますか？

pS私はwindow.location.hashなどについて話していません。上記が存在する場合 この質問に対する答え は正しくありません。

javascriptajaxgoogle-chrome
586
David Murdoch

これで、ほとんどの "現代"ブラウザでこれが可能になります。

これは私が読んだオリジナルの記事です（2010年7月10日投稿）： HTML5：ページを更新せずにブラウザのURLを変更する 。

PushState/replaceState/popstate（別名HTML5 History API）の詳細については、 MDNのドキュメントを参照してください 。

TL; DR、これができます：

window.history.pushState("object or string", "Title", "/new-url");

ページをリロードせずにURLを変更する への私の答えを参照してください - /基本的な使い方については/。

806
David Murdoch

ハッシュの後のものだけを変更する - 古いブラウザ

document.location.hash = 'lookAtMeNow';

フルURLを変更しています。 Chrome、Firefox、IE 10+

history.pushState('data to be passed', 'Title of the page', '/test');

上記は履歴に新しいエントリを追加するので、前の状態に戻るには戻るボタンを押します。履歴に新しいエントリを追加せずにその場でURLを変更するには

history.replaceState('data to be passed', 'Title of the page', '/test');

今すぐコンソールでこれらを実行してみてください。

131
Pawel

ブラウザを検出するためのDavids回答への更新はpushstateをサポートしていません：

if (history.pushState) {
  window.history.pushState("object or string", "Title", "/new-url");
} else {
  document.location.href = "/new-url";
}
23
metamagikum