Clever Geek Handbook

How can I tell if there are two divs with the same id in javascript?

Is there a way to check if two divs have the same ID?

I have created divs dynamically and I am having a hard time deleting the div with duplicate id, can anyone help here?

+3


source to share


7 replies


I don't know what you are trying to achieve here, but usually you shouldn't have two elements with the same ID. But if you have a reason to do so, perhaps you are creating a validator or something like that, you can do the following to count the number of items

var count = document.querySelectorAll('#test').length;

console.log(count);


then you can skip them and remove them with

document.querySelectorAll('#test')[1].remove();
+2


source


Try:



        $('[id]').each(function () {
            var ids = $('[id=' + this.id + ']');
            if (ids.length > 1 && ids[0] == this) {
                $(ids[1]).remove();
            }
        });
+1


source


You need to loop through all the elements, as helpers like getElementById()

will not work well if they are not unique.

Example, no jQuery needed. A double identifier signifies.

var idMap = {};

var all = document.getElementsByTagName("*");

for (var i=0; i < all.length; i++) {
     // Do something with the element here
     var elem = all[i];
     if(elem.id != ""){ //skip without id
       if(idMap[elem.id]){
          alert("'" + elem.id + "' is not unique")

       }
       idMap[elem.id] = true; 
     }
}
      

        
        
        
      

    
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>

    <title></title>
</head>
<body>
    <div id="id1"></div>
    <div id="id2"></div>
    <div id="id3"></div>
    <div id="id4"></div>
    <div id="id5"></div>
    <div id="id1"></div>
</body>


</html>
Run codeHide result


0


source 


$('[id]').each(function(){
    var ids = $('[id="'+this.id+'"]');
        if (ids.length>1 && ids[0]==this){
            $("#"+this.id).remove();
        }
 });​
Run codeHide result


the above function uses jquery to create an array of all ids in the document and remove the duplicate id

0


source 


var idList = [];
$('*[id]').each(function(){
    var id = $(this).attr('id');
    if($.inArray(id, idList)){
        alert('the id ' + id + ' is already set!');
    } else {
        idList.push(id);
    }
});
0


source


Something like this should do what you want

$('[id]').each(function (i) {
    $('[id="' + this.id + '"]').slice(1).remove();
});
      

        
        
        
      

    
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id = "1">
ola
</div>
<div id = "2">
ole
</div>
<div id = "1">
ola
</div>
<div id = "3">
olo
</div>
<div id = "1">
ola
</div>
<div id = "3">
olo
</div>
Run codeHide result


Example based on link: jQuery: Find duplicate IDs and remove all but the first

0


source


Can you just monitor + F and look for ids? Also if you are using an editor like atom, you can delete every other duplicate in one go after searching.

-1


source






More articles:


All Articles