javascript - 如果图像已存在，则从页面中删除图像

Question

我在不同的 div 中有多个图像，但有时 2 个图像完全相同。如何从页面中删除其中一张图片以外的所有图片？

这可以用 jquery/javascript 实现吗？甚至是 CSS？

例子:

<div id="Content">
 <div class="Media">
  <img src="1.jpg">
 </div>
</div>
<div id="Content">
 <div class="Media">
  <img src="2.jpg">
 </div>
</div>
<div id="Content">
 <div class="Media">
  <img src="1.jpg">
 </div>
</div>
<div id="Content">
 <div class="Media">
  <img src="4.jpg">
 </div>
</div>
<div id="Content">
 <div class="Media">
  <img src="1.jpg">
 </div>
</div>

我如何才能让它只显示其中一个 div:

<img src="1.jpg">

这是服务器端代码，它返回一个大的 json 文件，其中包含来自 Twitter 页面的所有帖子，但我认为无法过滤它，所以它首先检查重复项？

       success: function(data){
           twitter = JSON.parse(data);
                for(var key in twitter.statuses){
                    if (typeof twitter.statuses[key].entities.media != "undefined") {

                            if( $.inArray(twitter.statuses[key].entities.media, container) == -1 ) {
                            container.push(twitter.statuses[key]);
                            }
                        }
                }
           },
       error: function(data){
           console.log(data);
       }

我希望有人知道如何解决这个问题谢谢!

Answer 1

可以获取所有的IMG标签，看src是否唯一。如果不是，您可以将其删除。这是一个例子:

$(document).ready(function() {
  var img = $("img");
  var used = {};
  img.each(function() {
    var src = $(this).attr('src');
    if(used[src]) $(this).remove();
    used[src]=1;
  });
})

此处为 CodePen:http://codepen.io/cfjedimaster/pen/tDprC