更改 img src 的结尾以渲染不同的 scene7 图像预设。（正则表达式帮助）

Question

我正在尝试更改图片 src 的结尾，以便在移动设备上呈现更小的图片。我们使用 Adobe Scene 7，因此我可以为全尺寸图像设置预设，然后为移动图像设置预设，然后我只需要代码来进行 url 更改。我在这里找到 this question 并试图将其应用到我的代码中。我的问题是我不知道如何为此编写正则表达式，美元符号让我失望。

$('img').each(function () {
    var src = $(this).attr('src');
    $(this).attr('src', src.replace($fullbanner$, '$mobilebanner$');
});

为了简单起见，有人可以帮我写一个正则表达式来填充 "src.replace( , );" 部分吗？ url 的初始值为 domain/company/banners/homepage/img_name?$fullbanner$ 然后我们只需要将其更改为 domain/company/banners/homepage/img_name?$mobilebanner$.

还有，如果说起来简单的话：

src.replace('$fullbanner$', '$mobilebanner');

那就直说吧。我非常感谢提供的任何帮助。

Answer 1

您可以使用 attr(function) 循环遍历每个实例：

$('img').attr('src', function(index, existingSrc){
    return existingSrc.replace('$fullbanner$', '$mobilebanner');
});

请注意，这不是一个非常有效的策略，因为它不会阻止浏览器对全尺寸图像发出初始请求，因为初始页面加载中存在的任何图像在您的脚本运行之前就已发出请求

更改 img src 的结尾以渲染不同的 scene7 图像预设。（正则表达式帮助）

Change ending of img src to render a different scene7 image preset. (regex help)

html

regex

jquery

image

scene7

更改 img src 的结尾以渲染不同的 scene7 图像预设。 （正则表达式帮助）

Change ending of img src to render a different scene7 image preset. (regex help)

html

regex

jquery

image

scene7

更改 img src 的结尾以渲染不同的 scene7 图像预设。（正则表达式帮助）