1

我正在寻找一种方法来替换可以在页面上的任何位置使用的图像。

因此，如果我们有一个这样的示例 html 页面：

<html>
   <head>
   </head>

   <body>

       <img id="1" src="example.com/img/1889.png">

       <div style="background: url('example.com/img/1889.png')">
       <div>

       <a>
           <img id="2" src="example.com/img/1889.png">
       </a>

   </body>

</html>

无论何时 - example.com/img/1889.png - 出现，都必须用其他东西替换。

编辑

不幸的是，我不能使用任何 javascript 库。它用于浏览器插件。我也不能使用浏览器特定的 API

4

2 回答 2

4

这里可能有一些语法错误，但基本上只是尝试类似：

<script>
    var imgs = document.getElementsByTagName("img");
    for (var i = 0; i < imgs.length; i++) {
        if (imgs[i].src == "oldImg")
            imgs[i].src = "newImg";
        }
    }
    var divs = document.getElementsByTagName("div");
    for (var i = 0; i < divs.length; i++) {
        if (divs[i].style.backgroundImage == "oldImg")
            divs[i].style.backgroundImage = "newImg";
        }
    }
</script>
于 2013-05-21T09:27:15.723 回答
1

以下代码可以满足您的需求：

var images = document.querySelectorAll('[src]'), // all image and input elements
    styled = document.querySelectorAll('[style]'), // all elements with inline style
    iLen = images.length,
    sLen = styled.length,
    url = 'example.com/img/1889.png', // the string you're searching for
    str = 'some/string', // replace with whatever you choose
    i;

// check for 'example.com/img/1889.png' in image source
for (i = 0; i < iLen; i += 1) {
    if (images[i].src.indexOf(url) !== -1) {
        images[i].src = str;
    }
}

// check for 'example.com/img/1889.png' in either background or background-image
for (i = 0; i < sLen; i += 1) {
    if (styled[i].style.backgroundImage.indexOf(url) !== -1) {
        styled[i].style.backgroundImage = 'url(' + str + ')';
    }
}

演示

于 2013-05-21T10:21:05.363 回答