Question

传递给我的HTML页面最初有一个看起来像这样的图像路径......

<img src="img/foo.jpg"

只需要改为新路径。

我有一个遍历图像集的循环：

container_images = container.getElementsByTagName('img');
             imgSrc = /img\//gi,

for (var i = 0; i < container_images.length; i++) {
    var images = container_images[i];

    if (images.src.indexOf('img') !== -1) {
        images.src = images.src.replace(imgSrc, 'new/path/here/');
    }
}

现在这完全可以本地，但是当我在公司的QAF服务器上运行时，服务器似乎正在添加开发路径：

<img src="http://ryelxusecqcm1.rye.com:8080/us-home/tools/img/foo.gif">

那么除.replace之外还有一种方法可以明确地消除掉旧路径并放入我的新路径吗？即'new/path/here/'

Answer 1

问题可能是因为你正在使用＆＃34;亲戚＆＃34;代码中的路径（即不以＆＃34开头的路径; /＆＃34;）：

images.src = images.src.replace(imgSrc, 'new/path/here/');

由于您使用的是相对路径，因此您的浏览器会将您的路径添加到服务器的网址中。

试试这个，看看是否有帮助。：

images.src = images.src.replace(imgSrc, '/new/path/here/');

（注意领先＆＃34; /＆＃34;在＆＃39; / new / path / here /＆＃39;）

Answer 2

我找到了这么简单但优雅的解决方案。我没有测试indexOf的字符串（如果我没有两个不同的环境就可以工作），而是寻求更直接的解决方案。

images.src = '/dam/avon-us/landing-pages/rep-news/' +  images.src.split('/').pop();

这首先将图像路径/字符串转换为数组中的项集合，由正斜杠描绘。 ['current', 'path', 'foo.jpg']然后使用pop方法返回数组中的最后一项，即文件名＆amp;延期。 foo.jpg然后我们只是添加我们想要图像的路径！

想要感谢所有试图帮助我的人！

有没有办法使用JavaScript显式更改图像源路径？

2 个答案: