相关图片坏了,需要javascript修复

lea*_*uff 2 html javascript replace image

新来的.我无法访问我网站上的大多数源文件,因此我尝试使用javascript在页面加载时修复一些损坏的图像.

当我将inspect元素用于其中一个损坏的图像时,它显示如下:

<img src="-82.jpg" width="60px">
Run Code Online (Sandbox Code Playgroud)

什么时候应该

<img src="http://example.com/files/images/-82.jpg" width="60px">
Run Code Online (Sandbox Code Playgroud)

这是一堆不同的图像,-82.jpg,-2482.jpg,-3582.jpg

这是我到目前为止所尝试的内容.这似乎工作,但由于某种原因,它打破了页面上的其他JavaScript.


HTML

<script type="text/javascript" src="http://example.com/files/js/fiximages.js"></script>
<body onload="fixImages();">
Run Code Online (Sandbox Code Playgroud)

我的fiximages.js文件

function fixImages() {
    var toReplace = '<img src="-';
    var replaceWith ='<img src="http://www.example.com/files/images/-';
    document.body.innerHTML = document.body.innerHTML.replace(toReplace, replaceWith);
}
Run Code Online (Sandbox Code Playgroud)

我有点像菜鸟,所以我还需要知道如何将html链接到javascript,以便在页面加载时加载它.多谢你们.

mel*_*cia 5

这应该可以解决您的问题:

function fixImages() {
    // Create a list of all img which src starts with "-".
    var imgs = document.querySelectorAll('img[src^="-"]');

    // Loop through this list.
    for (var i = 0; i < imgs.length; i++) {
        // For each img, replace its src with the correct path + the
        // src that's already there.
        imgs[i].setAttribute('src', 'http://www.example.com/files/images/' + imgs[i].getAttribute('src'));
    }
}
Run Code Online (Sandbox Code Playgroud)

演示