javascript - 重复 ID 影响

Question

对JQM有以下疑惑:

1.如果我们在单独的 html 文件中使用重复的 id，对 jquery mobile 有什么影响。

1. 假设我们在单独的 html 文件中有重复的 id，但如果我们不使用该 id 做任何事情，它会影响吗？

2. 如果我们通过某种层次结构在 javascript 中使用唯一选择器，是否可以在单独的 html 文件中使用重复的 id

我对此很担心，因为我正在使用相同的 html 文件使用 ajax 将其加载到不同的页面中。由于在这种情况下 id 相同，并且它们都在 DOM 中，因此有什么影响。或者，我应该通过更改 ID 创建一个单独的文件并使用它。

Answer 1

简介:

让我们从头开始，您可能知道 jQuery Mobile 如何处理页面，但其他一些读者可能不知道。

基本上，jQuery Mobiles 使用具有属性 data-role="page"的 div 元素来表示用户可见的页面。在给定的时刻只能看到一个页面(一些插件可以提供更多，但这不是这个问题的重点)从而产生多层应用程序的错觉。可以将多于一个页面加载到 DOM 中，除其他好处外，这将为我们提供漂亮的页面过渡效果。

答案:

1. 在 jQuery Mobile 中使用重复的 id，如果使用得当，不会产生任何不良影响。但规则总有异常(exception)。页面必须有唯一的 ID。这意味着您可以拥有具有相同 ID 的页面，但您将只能访问第一个实例。所有其他页面元素都可以有相同的 id，jQuery Mobile 不关心，只要你仔细观察你在做什么。

2. 就像答案 1 一样。无论您在单独的 html 文件中还是在一个大型 html 文件中具有相同的 ID 都没有关系，只要页面 ID 是唯一的即可。同样，您可以加载另一个 html 文件，其中的页面与已加载到 DOM 中的页面具有相同的 id，但是一旦您尝试访问其中的内容，您将访问最初存储在 DOM 中的页面。所以没有必要像这样使用它。

3. 唯一的规则是页面必须有唯一的 ID。您可以拥有尽可能多的其他相同 ID，只要它们是页面容器的子级即可。

这一切可能令人困惑，但请耐心等待。为了解决这个问题，jQuery 开发人员创建了一个独特的选择器，可以帮助您获得事件页面。这很重要，因为如果我们的页面内容在页面之间是相同的(当然页面 ID 是唯一的)，那么只有通过一些事件的页面选择器才能访问当前页面内容。

示例:

$.mobile.activePage

这是一个事件页面选择器，它基本上是一个包含整个事件页面的对象，因此您可以使用它来更改事件页面内容，例如:

$.mobile.activePage.find('[data-role="content"]').append(......);

然后如果你想访问其他页面相同的内容你会这样做:

$('#pageID').find('[data-role="content"]').append(......);

结论

只要页面具有唯一 ID，即使您拥有相同内容的相同页面也没关系。