更好的方式來管理重複的id名稱...屬性

Question

我在一個項目中工作，可以接收多個HTML片段，每個片段可以從不同的用戶發送，實際上一些片段可以包含相同的id名稱或CSS班級名稱，如何管理重複的名稱，並將其定位在JS或PHPDOM？

Answer 1

如果你知道的唯一ID來搜索，你可以輕鬆地在PHP更換使用str_replace函數精確匹配：

$html = str_replace(array('id="test1"', 'id="test2"'), array('id="new1"', 'id="new2"'), $html); 

要在PHP中的字符串搜索和替換CSS類名，你可以使用的preg_replace 。 HTML節點上可能有多個類名，所以正則表達式可以更好地解析它。

Answer 2

如果你可以在JavaScript中存儲片段（AJAX或其他），那麼你可以在頁面上試試這個功能 - 它應該可以在任何設備上工作，並通過在將其添加到DOM之前使用隨機數字重命名來修復任何重複ID

Live Demo

$(function() { 
    var counter=0,prefix="renFrag",fragments = [ 
     $('<div id="id1">Fragment1</div>'), 
     $('<div id="id2">Fragment2</div>'), 
     $('<div id="id3">Fragment3</div>') 
    ] 
    $.each(fragments,function() { 
     var id = $(this).attr("id"); // the ID of the fragment 
     if ($("#"+id).length>0) { // find if this ID is already in the DOM 
    // rename the fragment. NOTE Date().getTime() was not random enough 
    // $(this).attr("id",id+'_'+Math.floor(Math.random() * 10000)); 
     $(this).attr("id",prefix+(counter++)); 
     } 
     $(this).appendTo("#container"); // add the fragment to the DOM 
    }); 
    $("div").each(function() { // display the ID for debugging (remove when happy) 
     $(this).append("-"+this.id); 
    }); 
}); 

如果您需要訪問新片段，固定字符串添加到它，改變隨機到一個計數器，並使用$("div[id^=renFrag]").whatever或$("div[id=renFrag"+cnt+"]").whatever

如果有一個重新嵌入你需要保留的腳本和CSS，一個通常不推薦的選項，但你的情況是特殊的，是將每個片段加載到它自己的iFrame中。請注意，在頁面或通過iFrames執行外部腳本存在安全風險。