在标签中执行JavaScript，并在整个页面导航中保持不变

Question

我试图弄清楚如何自动执行单击事件，以自动推进一系列项目的前进。 具体细节如下：

• 有1个或多个项目队列（在此脚本中由用户确定）
• 每个队列有可变数量的项目
• 队列页面的URL是静态的
• 通过单击队列页面上的按钮来启动每个队列
• 队列页面上按钮的querySelector是静态的并且是已知的
• 单击队列页面上的按钮将加载队列中第一项的页面
• 每个项目页面使用不同的URL（与队列开始URL相同）
• 单击项目页面上的按钮可加载下一个项目的页面
• 项目页面上按钮的querySelector是静态的并且是已知的
• 在队列中最后一项的页面上，单击按钮将加载队列页面

这是流程的直观图：

编写完成此任务的脚本后，我意识到我无法在页面导航中持久化正在运行的脚本（至少我不这么认为）。 我什至考虑制作一个Chrome扩展程序并使用内容脚本 ，但是我认为这不会在整个页面导航中持久化js。

我如何实现我的目标？

Answer 1

sessionStorage或localStorage可以帮助您跨页面转换存储简单数据。

另一个选择是研究可以为您提供JavaScript路由的框架或库。 路由将使您的JavaScript能够在页面加载期间保持持久状态，并允许您在应用程序周围传递更复杂的数据而不会丢失状态。