Question

请告诉我如何才能在文件名之前替换图像源字符串的URL地址？

现在我这样做就像$('img').attr('src', add+"slide1.jpg");这样的硬编码方式，但我需要摆脱JS部分中的文件名，只需更新文件名前的URL字符串

＆＃13;

var add = "https://lamaisonduchien.ca/wp-content/uploads/revslider/home_1/";
$(".button").on("click", function(){
     $('img').attr('src', add+"slide1.jpg");
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="button">Update</button><br />
<img src="http://www.dpwts.com/slide1.jpg" alt="Smiley face" height="300" width="300">
<img src="http://www.aseanta.org/images/slide/slide1.jpg" alt="Smiley face" height="300" width="300">

＆＃13;

Answer 1

您可以使用正则表达式检查jpg或gif等...：

^.+(?=.*\b.+\.(jpg|gif))

从字符串^
取一个或多个字符.+
使用positive lookahead检查字符串是以.jpg还是.gif结尾
- 匹配字边界\b
- 取一个或多个字符.+
- 匹配点\.
- 后跟扩展程序jpg或gif

var add = "https://lamaisonduchien.ca/wp-content/uploads/revslider/home_1/";
$(".button").on("click", function(){
    $('img').each(function(index, val) {
        var src = $(val).attr("src");
        var pattern = /^.+(?=.*\b.+\.jpg)/;
        $(val).attr("src", src.replace(pattern, add));
    });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="button">Update</button><br />
<img src="http://www.dpwts.com/slide1.jpg" alt="Smiley face" height="300" width="300">
<img src="http://www.aseanta.org/images/slide/slide1.jpg" alt="Smiley face" height="300" width="300">

然后，您可以使用replace将匹配值替换为add变量。

更新图像源Url字符串仅限图像名称

1 个答案: