Javascript 在多个页面中获得无序、不重复的项目

我有五个不同的页面。每个按钮都有一个按钮，可以随机重定向到其他按钮之一

我正在尝试这样做，这样用户就不会看到重复的页面（至少在浏览完所有页面之后不会）

我可以添加一个函数来处理同一页面中随机的、不重复的内容，但如何让该函数在不同页面上工作，记住哪些页面已经被访问过

我尝试将该函数保存在一个外部js文件中，并在每个页面的head部分调用它，但它不起作用

我还尝试使用localStorage，但没有结果

我做错什么了吗？首先，这可能吗

这就是我正在处理的问题：

localStorage.getItem（“currentRemainingPages”）；
var page1=“0001.html”
var page2=“0002.html”
var page3=“0003.html”
var page4=“0004.html”
var page5=“0005.html”
常量原始页面=[page1，page2，page3，page4，page5]；
让剩余页面=[]；
函数随机化（）{
如果（remainingPages.length==0）remainingPages=originalPages.slice（）；
setItem（“currentRemainingPages”，remainingPages）；
常数{
长
}=剩余页面；
const[page]=remainingPages.splice（Math.floor（Math.random（）*长度），1）；
window.location.href=页面；
}

第0页
随机页面

三个问题：

• 只需调用

  localStorage.getItem（“currentRemainingPages”）但不要对结果执行任何操作。相反，您总是使用空数组初始化
  let remainingPages

• 您需要序列化和反序列化数组，因为

  localStorage

  仅存储字符串。您可以简单地通过分隔符进行连接和拆分，或者使用JSON或其他一些自定义编码
• 调用

  localStorage.setItem（“currentRemainingPages”，remainingPages）

  从

  剩余页面

  中选择（并删除）随机页面之前

改用

const originalPages = ["0001.html", "0002.html", "0003.html", "0004.html", "0005.html"]
let remainingPages = (() => {
    try {
        return JSON.parse(localStorage.getItem("currentRemainingPages"));
    } catch(e) {
        return null;
    }
})();
if (!Array.isArray(remainingPages) || remainingPages.length == 0)
    remainingPages = originalPages.slice();

function randomize() {
    const i = Math.floor(Math.random() * remainingPages.length);
    const [page] = remainingPages.splice(i, 1);
    localStorage.setItem("currentRemainingPages", JSON.stringify(remainingPages));
    window.location.href = page;
}

---

放置

localStorage.setItem（“currentRemainingPages”，remainingPages）

从

remainingPages

中选择（并删除）随机页面后，还要注意

localStorage

存储字符串。你需要

JSON.stringify

和

JSON.parse

你的数组（或者字符串

.split（“，”

和

.join（“，”）

它）。@Bergi我尝试了第一件事。我还是没有结果。至于使用

JSON.stringify

和

JSON.parse

，我还在学习JavaScript。。。我还没到JSON。要使代码正常工作，我必须对代码做些什么？@MikeMichaels您在浏览器devtools中是否有任何错误？@MikeMichaels OK，已调整，以便它可以处理本地数据库中的无效值storage@MikeMichaels您是否尝试使用调试器查看

remainingPages

的值，它是否具有您期望的值？a）在应用程序面板下，查看存储->本地存储b）它是一个全局变量，因此只需在控制台中输入它即可访问其值c）更改代码以在该行中包含

console.log（remainingPages）

或d）并检查该值非常感谢您的帮助。我从这篇文章中学到了很多。我浏览了

剩余页面的值。一切正常。我发现我测试的方法不对。我应该在测试任何东西之前清除存储。我得到的重复页面实际上是上一个会话中的页面。