javascript - ボディから重複したdom要素を削除するには?

Question

クラス名「コンボ」で、ボディのdiv重複要素を複製しました。元の div 要素を除くすべての重複を削除する必要があります

Answer 1

問題は、複製されたオブジェクトが元のオブジェクトと同じ属性を持つため、それらを区別するのがかなり難しいことですが、これを試すことができます:

(function()
{
                   //or indeed: querySelector('.combo') which returns a single DOM ref
    var original = document.querySelectorAll('.combo')[0];//reference to the original
    //clone and add
    function removeClones()
    {
        var i,all = document.querySelectorAll('.combo');
        for(i=0;i<all.length;i++)
        {
            if (all[i] !== original)
            {//this is a clone
                all[i].parentNode.removeChild(all[i]);
            }
        }
    }
}());

それはそれを行う必要があります。別の方法は、クローンを DOM に追加する前に、クローンにクラスを追加することです。

var clone = original.cloneNode(true);
clone.className += ' combo-clone';
//then, to remove:
var clones = document.querySelectorAll('combo-clone');//selects all clones

Answer 2

複製された要素への参照をどこかに保持します (配列など)。その配列をループしてfoo.parentNode.removeChild(foo)、各値を呼び出します。

Answer 3

var fn = function(originalEl){

    var els = document.querySelectorAll('.combo');

    for(var i=0; i<els.length; i++){
        if( els[i] !== originalEl ){
            els[i].parentNode.removeChild(els[i]);
        }
    }

}