如何使用Javascript显示2个随机数并根据页面URL将其存储到用户缓存？

Question

我这里有个密码：

​

const stored = localStorage[location.href]
const number = stored || Math.floor(Math.random() * 6) + 2

document.getElementById("n1").innerHTML = number

if ( !stored ) localStorage[location.href] = number

<div>
 The first number is <span id="n1"></span>.
</div>

​

这将显示2~6之间的随机数，并将其保存到由页面URL映射的用户缓存中，因此，如果用户重新加载页面，同样的数字将再次出现，但如果用户使用相同的代码转到不同的页面，则会在2~6之间生成另一个数字。

总括而言：

如果用户首先加载我的网站，生成第3号，则显示3号，如果用户返回同一个网站，数字3将保持显示，但如果用户使用相同的代码转到我的网站内的另一个URL，则应该生成另一个号码。

但是我现在要做的是显示第二个数字，与第一个数字不同，但是使用相同的“本地存储机制”来像第一个数字一样工作。但是我不能仅仅更改代码中的变量和本地存储键-- localStorage[location.href] --因为这个键用于将本地存储映射到页面URL。

我是否可以使用我的代码使其生成2个随机数并将其存储在用户缓存中，如果用户重新加载相同的页面，则使这些数字保持不变，但如果用户转到不同的页面，则更改为不同的数字？

提前感谢

Answer 1

据我理解，您的要求是在localStorage中为相同的键存储两个值。由于localStorage只存储字符串值，所以在将其转换为字符串后，可以存储2个数字的数组。

const stored = localStorage[location.href] 
const numbers = stored && JSON.parse(stored) || [Math.floor(Math.random() * 6) + 2, Math.floor(Math.random() * 6) + 2]

document.getElementById("n1").innerHTML = numbers[0]
document.getElementById("n2").innerHTML = numbers[1]

if ( !stored ) localStorage[location.href] = JSON.stringify(numbers)

或者您可以使用两个键，比如localStorage[location.href+'1']和localStorage[location.href+'2']。