使用 Java 脚本更新 DOM 项列表的方法

the way to update a list of dom item with java script?

本文关键字:列表 方法 DOM Java 脚本 更新 使用      更新时间:2023-09-26

我是这个网站的多合一开发者。在该站点中,如果您单击图形上的任何节点,它将更新结果div 的内容。我以愚蠢的方式这样做,我只是从头开始重写所有div 内容。我确信这不是最好的方法,那么您对这种动态更新有什么建议?

我认为会有一种方法将结果(可能是他们的 id)和结果的div 的 id 匹配,这样我就可以将所有这些代码片段div 保存在带有这些 id 的数组中。然后,当我需要更新时,我只是再次重新访问所有内容,但只是推送与结果匹配的 dom 对象。

是否也可以将 dom 对象保留在div 中并在需要时将它们推送到页面正文?

还是其他成功的方式?

只需隐藏与图形中单击的节点不匹配的div。这样,当他们单击重置时,您会显示所有div,而无需继续重新创建内容。

您可以将所有div 放在文档中并最初隐藏它们。将单个节点的所有div ID 保留在数组或某种对象中。

单击节点时,将与

单击的节点对应的div 插入到目标div 中,并将它们设置为可见。

这种方法的一个问题是:即使是隐藏的div 也是 DOM 树的一部分,当您将选定的div 插入目标div 时,这些div 实际上已从原始 DOM 节点移动到新节点。这样,当用户再次单击同一节点时,这些div 将不再存在。

解决此问题的一种方法是先克隆节点并将克隆的节点移动到目标位置,或者最好先将它们放回原处以避免在使用新div 更新目标之前悬空节点。

相关文章: