更好的方式来管理重复的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执行外部脚本存在安全风险。