javascript - 使用 Id 修改页面

Question

我正在尝试构建类似于 this signup form 的东西。

基本上，当您完成这些步骤时，整个页面都会发生变化(可能只是一个 div 消失，另一个 div 出现)。

问题是我似乎无法弄清楚他们使用什么来更改整个页面和网址。我的意思是我可以轻松隐藏一个 div 并使用 javascript 使另一个 div 出现，但这不会给我我正在寻找的 URL 效果，因为我希望用户能够使用后退/前进按钮进行导航来回执行这些步骤。

知道他们可能使用什么外部技术，或者它是否只是完全自定义的东西，因为他们的脚本自定义表单属性建议它(数据步骤):

第一步:

<form id="signup_form" class="fs_split_flex_wrapper" data-step="email">

第二步:

<form id="signup_form" class="fs_split_flex_wrapper" data-step="email">

Answer 1

看一下 JS 中的 History API: https://developer.mozilla.org/en-US/docs/Web/API/History_API

引用: “假设 http://mozilla.org/foo.html 执行以下 JavaScript:

var stateObj = { foo: "bar" };
history.pushState(stateObj, "page 2", "bar.html");

这将导致 URL 栏显示 http://mozilla.org/bar.html ，但不会导致浏览器加载 bar.html，甚至不会检查 bar.html 是否存在。”