使用 jquery 添加到 img 中的 src

Question

我需要改变这个：

<img src="example.jpg" alt="">

进入这个：

<img src="example.jpg?width=500" alt="">

with jquery，这个怎么实现，因为我不想覆盖src，但只需添加 ?width=500 位即可。

我的代码总共看起来像这样：

<div class="img-wrap"> 
     <p><a href="link">Link to something</a></p>

     <img src="example.jpg" alt=""> 

</div>

编辑好的，对不起，我没有指定，但我无法对 img 标签进行任何更改。图像是从后端生成的。 div 是我唯一能控制的事情。

Answer 1

您可以将字符串追加到 src 属性中。

编辑：

如果您只能控制 div 然后添加添加 ID。

$("#click-me").on("click", function(){
    $("#img-wrapper>img").attr("src", $("#img-wrapper>img").attr("src") + "?s=20");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="img-wrap" id="img-wrapper"> 
     <p><a href="link">Link to something</a></p>
     <img src="https://www.gravatar.com/avatar/7164662/38b30efb16b3d9eb8cc2737a872a79f0" alt="" /> 
     <button id="click-me" type="button">Click Me!</button>
</div>

Answer 2

假设您有一个名为 image1

的图像

<img src="example.jpg" alt="" id="image1">

使用

$('#image1').attr('src') = $('img').attr('src') + '?width=500' ;

这不会覆盖 img src，它只会将 ?width=500 附加到现有属性值。

Answer 3

<div class="img-wrap"> 
 <p><a href="link">Link to something</a></p>
 <img src="example.jpg" id="targetImage " alt=""> 
</div>

将图像的 id 添加到 jquery 中的 select 并使用 attr 您可以将文本添加到图像 src 中，如下所示

var img= $("#targetImage");
img.attr("src", img.attr("src")+"?width=500");

Answer 4

试试这个

<script>
  $(".img-wrap p img")[0].src += "?width=500";
</script>

<div class="img-wrap">
  <p><a href="link">Link to something</a>
  </p>
  <img src="example.jpg" alt="">
</div>

Answer 5

$("#img-wrap img:first").attr('src', img.attr("src")+"?width=500");

没有图像的 id 和 class 名称，您可以 select 借助上层 DOC 元素 classes

使用 jquery 添加到 img 中的 src

add to src in img with jquery

jquery

src

编辑：