重复的id影响

Duplicate ids impact

本文关键字：影响 id      更新时间：2023-09-26

在JQM中有以下疑问:

1。如果我们在不同的html文件中使用重复的id，会对jquery mobile产生什么影响?

  1. 如果我们在不同的html文件中有重复的id，但如果我们不使用任何id，它会影响吗?

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

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

简介:

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

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

答案:

  1. 在jQuery Mobile中使用重复的id，如果使用得当不会有任何不良影响。但凡事总有例外。页面必须有唯一的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就可以了。

我刚刚花了6个小时调试一个重复id很重要的问题。

每个页面都有一个标题，带有一个弹出菜单面板的按钮。每个页面都给它一个id 'navpanel'。

现在有一个页面想要隐藏按钮。在pageShow事件中，它说

$("#navpanel").toggle(user.isRegistered());

但是由选择器找到的id为navpanel的元素是我们刚刚离开的页面中的元素，而不是我们正在导航到的那个，很难追踪结果(我在凌晨2:14写这篇文章，刚刚解决了这个问题)。

相关文章：