ダイナミックにページのHTMLソースを変更するには？

Question

これまでは、ページのHTMLソースを完全にリロードせずに変更することはできなかったと私は信じていました。私が見たことは、pushStateに何らかの形で関連していると思われる（それだけではない）：Quartzのウェブサイト（qz.com）では、あなたが一番下に達したら次の記事にスムーズにスライドするURLをきれいに更新し、驚くほど、更新されたHTMLソースを使って、読んでいます。例えば

は、任意の物品、例えば：たぶん私は何かを見逃しているhttp://qz.com/643497/we-are-witnessing-the-rise-of-global-authoritarianism-on-a-chilling-scale/

をスクロールダウンし、誰かがこれがどのように行われるか説明できますか？ここで使用されているHTML5 APIはどれですか？

NOTEは：私の質問は（具体的に明らかではなく、DOMインスペクタ）ページのソースを表示するときに、あなたが見てすることができますHTMLコンテンツの更新に焦点を当てています。

Answer 1

これは典型的な非同期コンテンツの読み込みとよく似ていますが、はい、URLを変更するためにpushStateを使用しています。私は、ルートがうまく設計されているので、そのURLに行くと同じ記事が最初に出てくると思います。しかし、舞台裏では、一連のJSONPリクエストとpushState（）を組み合わせるだけで、うまく流れて整形式のドキュメントを作成できます。最新のデバッグコンソールの[ネットワーク]タブを使用してリクエストを確認することもできます。

URL更新のためのpushStateを使用して上の情報についてはこの回答を参照してください。Modify the URL without reloading the page

EDIT

あなたはソースがどのように変化しているかについて事実に立ち往生しているので、それについてこのように考える：私が言うとき"ルートはうまく設計されているので、そのURLに行くと同じ記事が最初に表示されます。"つまり、そのページに行くとその記事が反映されます。ソースを表示するだけでは、アクティブなURL（pushStateによって変更されているため、実際にはソースを取得する別のページに移動します）を取得し、DOM解析/レンダリングなしでテキストを取得します。特にこのサイトで何が起こっているのかを明確にすることを願っています。

Answer 2

ほとんどの「最新の」ブラウザでこれを行うことができます。

私が読んだ（2010年7月10日に投稿）：（HTML5: Changing the browser-URL without refreshing page）の元記事です。

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

あなたはこれを行うことができます。

window.history.pushState（ "オブジェクトまたは文字列"、 "タイトル"、 "/新しいURL"）;