如何判断同一页面上的两个元素是否具有相同的ID?

时间:2011-11-28 13:09:59

标签: javascript

我正在开发一个将在国外网站上运行的组件。 如何判断特定ID是否在页面上出现多次? 我需要知道这一点,以确保“从外部”提供给我的元素在这个意义上是独一无二的。

我已经尝试使用document.getElementById和document.querySelector来识别它,但两者似乎都返回了具有非唯一ID的第一个元素,而不是两者。 jQuery和Sizzle也没有帮助,因为他们使用那些相同的方法。

7 个答案:

答案 0 :(得分:4)

使用jQuery,您可以使用属性选择器而不是id选择器:

$("[id='someId']")

应该返回具有该Id

的所有元素

工作示例:http://jsfiddle.net/hunter/VvX7r/

答案 1 :(得分:1)

除了查询整个元素页面外,您还可以执行以下操作:

function isUniqueId( selector ) {
var elm = $(selector).get(0),
    prevId = elm.id,
    isUnique;

elm.id = "temp"+(+new Date);

isUnique = !$(selector).length;

    if( prevId ) {
    elm.id = prevId;
    }


return isUnique;
}

如果您将其附加到任何人的页面,性能应该是一个问题。

答案 2 :(得分:0)

ID应该是唯一的,因此您找不到很多可以帮助您的工具。

您是否尝试过递归迭代DOM中的每个元素并检查id?

答案 3 :(得分:0)

我不能为Sizzle说,但是因为Jquery在其方法中使用CSS选择器来返回Dom对象。就其本质而言,元素的id应该是唯一的。所以在这个实现中,JQuery只返回它找到的第一个结果是正确的,因为只应该有一个。

但是我看到你的问题在于你无法控制从外部来源放入页面的内容。

在这种情况下,如果没有解析每个HTML元素以检查重复项,我看不到任何其他选项。

答案 4 :(得分:0)

前一段时间我得到了这个片段形式,我不记得在哪里?它适用于FF firebug console。你或许可以适应它。

(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);
        }
    }
}
}());

答案 5 :(得分:0)

    var id =  "test1",
    elems = [];

 while ( d = document.getElementById(id) ) {
    elems.push( d );
    d.removeAttribute("id")
}

for ( i in elems ) {
    elems[i].setAttribute("id",id);
}

console.log (elems);

setAttributeremoveAttribute不是crossbrowser。 最简单的方法是使用属性[]的jQuery选择器,如hunter的答案

答案 6 :(得分:0)

请注意,querySelector只会返回第一个匹配项。试试querySelectorAll

document.querySelectorAll('#id');