如何使用javascript / JQuery在所有dom映像上交换img src中的一个术语

How can i swap one term in img src on all dom images using javascript / JQuery?

本文关键字：src img 术语 一个 交换 JQuery javascript 何使用 映像 dom      更新时间：2023-09-26
我需要将所有img src/products/210x110/foo-bar-foo-front.jpg

交换为/products/210x110/bar-foo-bar-angle.jpg并将其应用于dom中的每个图像。

我当前的代码可以工作，但将 dom 中第一个图像的 src url 应用于所有 img src 属性：

我只需要替换 1 个单词...

//toggle image angles
var img = $("div.product-image a img");
$('div#image-angle-switch').toggle(function() {
    $(this).html('<span></span> Angle view ')
    switch_to_low_fi();
}, function() {
    $(this).html('<span></span> Front view')
    img.attr("src", img.attr("src").replace("front", "angle"));
});
$('div#image-angle-switch').click(function() {
    img.attr("src", img.attr("src").replace("toggle"));
});

我可以为每个 img src 创建一个数组，交换一个单词并重新应用于每个 img 吗？

var tn_array = $("div.product-image a img").map(function() {
    return $(this).attr("src");
});
for (var i=0; i<tn_array.length; i++) {
    console.log(tn_array[i]);
}

得到了我的数组，但我应该如何应用它？任何帮助非常感谢。

遍历每个图像并更改其 src。

$('#image-angle-switch').data("view", "front").click(function () {
    var $this = $(this);
    if ($this.data("view") == "front") {
        $this.html('<span></span> Angle view ').data("view","angle");
        // this does the looping
        $("div.product-image a img").attr("src",function (i, src) {
            return src.replace("front", "angle");
        });
    } else {
        $this.html('<span></span> Front view ').data("view", "front");
        // this does the looping
        $("div.product-image a img").attr("src", function (i, src) {
            return src.replace("angle", "front");
        });
    }
});

还替换了旧的折旧切换方法。虽然可以做烘干机

相关文章：