JQuery检查DOM中的重复ID

我正在用ASP.NET MVC编写应用程序.与传统的ASP.NET相比,您更负责在生成的页面中创建所有ID.ASP.NET会给你讨厌但独特的ID.

我想添加一个快速的小jQuery脚本来检查我的文档是否有重复的ID.它们可能是DIVS,图像,复选框,按钮等的ID.

 My main panel 
 Oops we accidentally used the same ID 
 

我正在寻找一套设置和忘记类型的实用程序,当我做一些不小心的事情时,它会警告我.

是的我只在测试期间使用它,并且也欢迎替代品(例如firebug插件).

1> 小智..：

---

以下内容将向控制台记录警告:

// Warning Duplicate IDs
$('[id]').each(function(){
  var ids = $('[id="'+this.id+'"]');
  if(ids.length>1 && ids[0]==this)
    console.warn('Multiple IDs #'+this.id);
});

---

非常好的解决方案,但在`var ids = $('[id = \''+ this.id +'\']')中需要额外的引号;`所以它适用于ID中的点和其他奇怪的东西.

---

为此工作所需的DOM遍历量非常惊人

---

呵呵,我切换console.warn警告(...)所以我必须修复它们:)

2> Sjoerd..：

---

这个版本有点快,你可以将它复制到书签按钮,使其成为书签.

javascript:(function () {
  var ids = {};
  var found = false;
  $('[id]').each(function() {
    if (this.id && ids[this.id]) {
      found = true;
      console.warn('Duplicate ID #'+this.id);
    }
    ids[this.id] = 1;
  });
  if (!found) console.log('No duplicate IDs found');
})();

---

这个算法更好,只需要一个dom遍历而不是每个匹配元素一个.应该是接受的答案.

3> AutoSponge..：

---

我有一个大页面,因此脚本运行得太慢而无法完成(多个"继续脚本"消息).这很好用.

(function () {
    var elms = document.getElementsByTagName("*"), i, len, ids = {}, id;
    for (i = 0, len = elms.length; i < len; i += 1) {
        id = elms[i].id || null;
        if (id) {
            ids[id] =  ids.hasOwnProperty(id) ? ids[id] +=1 : 0;
        }
    }
    for (id in ids) {
        if (ids.hasOwnProperty(id)) {
            if (ids[id]) {
                console.warn("Multiple IDs #" + id);
            }
        }
    }
}());

4> Ionuț G. Sta..：

---

您应该尝试HTML Validator(Firefox扩展).它肯定会告诉你页面有重复的ID和更多.

5> Natrium..：

---

你为什么不验证你的HTML？

不允许使用双重身份证,通常您会收到解析错误.

---

当使用来自jquery ui的对话框等小部件时,经常发生在创建对话框后不清理时最终在DOM中出现重复项.