Javascript在使用localStorage重新加载时不保留div id？

我试图有三个链接，这将显示一个div当你点击他们。如果再次单击这些链接，将显示另一种类型的链接。例如，如果我有链接

one

，单击它将生成div

one

。再次单击它将生成div

one1

。这样，每个元素都有一个唯一的id，并且可以在以后将自定义样式应用于各个div

当用户单击一个

a

链接时，它会创建一个本地存储键，记录该类型div被单击的次数。例如，如果我单击div

one

的行

5次，localStorage键将为5。然后，当页面重新加载时，我的脚本将div复制到页面上5次，并将第1部分的计数器设置为5。这样，当您再次开始单击
a
链接时，它们不是从1开始，而是从5开始，因此它们不是任何冲突的ID

我遇到的问题是delete函数。假设用户复制了div
one
的
5
。这意味着
one1、one2、one3、one4、one5
都出现在屏幕上。如果用户重新加载页面，它们仍然存在。假设用户从页面中删除
div1
。它删除
div1
和所有与之相关的样式，并使其他div保持不变

但是，如果重新加载页面，脚本将复制从
1-4
开始的div（因为它们只有4个div保存到本地存储键），而不是从
2-5
复制，因为
#1
或
div1
已被删除

我意识到要读的东西很多，可能很难理解，所以我对其中的代码进行了修改


为了测试我说的话，你必须展示一些div，比如说“一”中的5个。您会注意到，
#one1、#two1和#three1
都有一个边框，以显示删除它们时发生的情况。复制div时，
div1
将具有边框。如果删除该div，则在重新加载页面之前，页面上的其他div不会受到影响。重新加载后，您会注意到前一个
div2
的id已更改为
div1
，而不是保持在
div2

有没有办法在不重写整个脚本的情况下解决这个问题？我觉得可能有一个更快的方法来修复它，但我无法想象

PS，如果您阅读了以上所有内容，我真的很感谢您的代码无法正常工作，对不起

不过，我确实大致实现了您所描述的目标：
我相信其中一个问题是，您只是在计算#1、#2、#3，并使用它动态创建div id

您需要的是一个包含所有
i
的数据结构，以便
div{i}
存在。可能创建一个列表并将其映射到您的键，即#1、#2、#3。然后，您将获得该列表并在
$（“.base”）
for循环中迭代元素

现在，如果您有5个div-one，并且删除了第5个div-one，那么您将有一个1、一个2、一个3、一个4。如果现在我插入另一个div one，您希望它位于5还是6？如果您想在“5”处，只需从列表中选择
max（）
，否则请使用如下所示的单独计数器-请参阅var:idx。然后将idx添加到您的列表中-我还没有对列表进行编码。我会尝试我的解决方案，但会花一些时间-不是所有熟悉JS。但我相信这个想法应该行得通

$（.a”）。单击（函数（）{
var target=$（this.attr（“href”）；
var id=$（target.attr（“id”）；
var x=$（“+id）.size（）；
var click=$（目标）.data（“clicked”）| | x；
var idx=localStorage.getItem（目标+“i”）；
$（目标）。数据（“单击”和++单击）；
如果（idx==null）{idx=1；}
var name=id+idx；
警报（名称）；
$（target）.clone（）.attr（“id”，name）.attr（“class”，“drag”+id）.appendTo（“body”）；
setItem（目标，单击）；
setItem（目标+“i”，++idx）；
});
不过，我的示例中的代码是有效的。你犯了什么错误？谢谢你的提琴，你为什么说“粗略”？我的意思是，我不能修改你的代码（我很懒）。就像你说的那样。啊，没问题。我对您的代码所做的唯一更改是使用了
数据
属性。顺便说一句，您的代码与您在问题中描述的问题完全一致。忽略上面的评论！请退房；我有一些警报。我已经实现了我提到的作为一系列索引的列表。另外，在主HREF中添加了一个类，否则您的${a}也会在关闭的HREF上调用，我相信您不希望这样做？代码中唯一不起作用的部分是，在刷新页面之前，新添加元素的超链接不起作用。我认为您应该在命名函数中定义${.close}功能，并使用.appendToBody为其分配添加的元素。