Question

我正在获取图像列表的来源，我需要在列表的每个元素上替换该src。

到目前为止，这是我的代码：

    if($('#miniature-img').length){
    $('.prateleira-blog li').each(function(){

        var replaceCaratula = '<img src="' + $('#miniature-img img', this).attr('src').replace("-1000-1000", "") + '" >';

    });
}

如果我放置控制台日志，它将打印所有已更改的图像源。所以，直到这里一切都在工作。现在，我需要用新的覆盖旧的图像标签。我尝试了下一段代码，但没有成功：

$('.prateleira-blog li').each(function(index, replaceCaratula){
            $('#miniature-img img', this).replaceWith($(replaceCaratula));  
        });

第一个图像标签出现在所有元素中。我该怎么办才能替换旧的每个新的图像标签？

我正在使用Jquery和HTML。

先感谢

Answer 1

我不知道这是不是您想要的，因为您的代码不清楚并且您尚未发布HTML。所以我只能猜测您的设置是什么。

如果只希望更改图像，则仅尝试更改src属性。它将自动加载新图像：

function changeImgs() {

  if($('#miniature-img').length){
    // read src attribute from the other image
    let source = $('#miniature-img').attr('src').replace('Original', 'Replaced');
    $('.prateleira-blog img').attr('src', source);
  }

}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<img id="miniature-img" src="https://via.placeholder.com/468x60?text=Original">
<br><br>
<div class="prateleira-blog">
  <li><img src="https://via.placeholder.com/468x60?text=Original"></li>
  <li><img src="https://via.placeholder.com/468x60?text=Original"></li>
  <li><img src="https://via.placeholder.com/468x60?text=Original"></li>
</div>

<button onclick="changeImgs()">Change</button> <!-- Only for showing -->

用另一个元素替换元素

1 个答案: