gpt4 book ai didi

javascript - 在 HTML 中分隔 "namespaces"

转载 作者:搜寻专家 更新时间:2023-11-01 05:25:48 24 4
gpt4 key购买 nike

由于 ID 冲突,我的应用程序出现问题。该应用程序基本上使用 AJAX 来根据用户需求加载代码片段。这些片段非常不同,但有时,一个代码片段在 HTML 标记中使用与另一个代码片段相同的 ID。

假设用户请求片段 1 并得到这个:

....
<input id="myvar" type="checkbox" name="myname" />
....

这段代码是通过JQuery.load()添加到主页面代码中的

然后,用户请求片段 2 并获得:

....
<div id="myvar">....</div>
....

此时,有 2 个具有相同 ID 的不同 HTML 标记,因此当应用执行以下操作时:

$("#myvar").something()

结果未定义。

所以,问题是我不知道是否可以使用任何 javascript 或 HTML 功能或技巧在 HTML 中拆分代码片段。

不能在加载时为所有 ID 添加前缀,因为每个片段都有一个关联的 javascript 代码来处理它并且需要访问片段 DOM。

好消息:片段在页面上完全隔离。页面结构是这样的:

<html>
<head>...</head>
<body>
<div id="header">...</div>
<div id="common_controls">...</div>
<div id="snippets">
<div class="snippet" id="snippet-1">
// Snippet 1 code here
</div>
<div class="snippet" id="snippet-2">
// Snippet 2 code here
</div>
</div>
</body>
</html>

有什么想法吗?

编辑:我无法控制片段内容,因此不能强制使用特定 ID 名称。

最佳答案

在 HTML 中多次使用相同的 ID 被认为是无效的,如您所见,这可能会导致问题。

如果您可以控制 Ajax 代码的输出,最好的解决方案是防止它多次输出相同的 ID。您没有提供足够的信息,无法让我准确地为您提供很多帮助来实现这一目标,但这当然是可能的。

如果相同的 ID 来自不同的 Ajax 调用,您可以确保每个 Ajax 调用生成的所有 ID 都以唯一名称为前缀(可能是生成它们的代码片段的模块名称?)。

如果它们来自相同的代码,那么您可能会生成相同 ID 的唯一原因是您是否在页面上多次输出相同的数据。即使在这里也会有解决方案,但我需要更多地了解该应用程序才能在这种情况下提供很大帮助。

但无论哪种情况,所描述的问题似乎都与通过 jQuery 访问它有关。好消息是 jQuery 实际上对重复的 ID 非常宽容。

如果只是让它与 jQuery 一起工作的情况,那么您应该能够让它工作而不必修复实际的重复。只要您可以运行一个选择器来唯一地选择您想要的那个,jQuery 就会非常高兴。

如果您想这样做,只需将每个 Ajax 响应包装在 <div> 中即可。具有自己的唯一 ID,然后您可以使用嵌套选择器引用这两个副本,如下所示:

$("#ajaxblock1 #myvar").something()
$("#ajaxblock2 #myvar").something()

这在 jQuery 中工作得很好。

但是,我不能保证同样的事情在 CSS 和标准 DOM 中运行良好 getElementById()函数也会崩溃,所以如果你打算使用 jQuery 以外的任何东西,那么你将需要删除你的 ID。

关于javascript - 在 HTML 中分隔 "namespaces",我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7572704/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com