图片链接替换为其他链接JS

Image Link replace with other link JS

本文关键字:链接 其他 JS 替换      更新时间:2023-09-26

我有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。帮帮我。

遍历所有图像(按标记名),而不是按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。

在一个页面中不能有多个具有相同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")替换为$(".yourclassname")

您应该为每个img使用不同的id。您还可以将一个类添加到要更改的所有img中,然后使用jquery 更改它们