Question

我有img的html标签

<img id="photo" src="//lh5.googleusercontent.com/-nt2iZrVQYZE/AAAAAAAAAAI/AAAAAAAAAEQ/z6WGWyexYpM/s512-c/photo.jpg">

将s512-c更改为s36-c我正在使用

<script type="text/javascript">
//<![CDATA[
$(document).ready(function(){
var orgImg = document.getElementById('photo');
orgImg.src = orgImg.src.replace('s512-c', 's36-c');
})();
//]]>
</script>

但这只是将一个id =“photo”替换为

<img id="photo" src="//lh5.googleusercontent.com/-nt2iZrVQYZE/AAAAAAAAAAI/AAAAAAAAAEQ/z6WGWyexYpM/s36-c/photo.jpg"/>

我想将所有图片链接s512-c更改为s36-c。帮助我。

Answer 1

迭代所有图像（tag name），而不是通过id获取图像。我还要注意每个DOM元素id应该是唯一的;你不能将同一个id分配给多个图像。

<script type="text/javascript">
$(document).ready(function(){
    var images = document.getElementsByTagName('img');
    for (var i = 0; i < images.length; ++i) {
        var orgImg = images[i];
        orgImg.src = orgImg.src.replace('s512-c', 's36-c');
    }
})();
</script>

如果您的网页上的图片数量多于需要修改的图片数量，您可能需要为执行该网页的图片指定一个类别，而不是使用document.getElementsByClassName。

Answer 2

您不能在一个页面中拥有多个具有相同ID的元素。你应该做的是通过标签名称（img）检索图像，或者给它们一个类名并用它来检索它们。既然您正在使用jquery，那么这里有一个jquery的解决方案：http://jsfiddle.net/DVS67/

$(document).ready(function() {
    $("img").each(function(index, elem) {
        $(elem).attr("src", $(elem).attr("src").replace('s512-c', 's36-c'));
    });
});

如果您决定使用类名，只需将$("img")替换为de $(".yourclassname")

Answer 3

你应该为每个img使用不同的id。您还可以向要更改的所有imgs添加一个类，然后使用jquery

更改它们

Image Link替换为其他链接JS

3 个答案: