如何用加载的dom上的JavaScript替换页面上所有空的<img src="">？

Question

我需要一个在 DOM 加载时启动的函数。

在我的 HTML 页面中有几个空的图像标签，就像我想在加载所有内容时将图像名称添加到 src-property 中以获得类似的内容

<img src="blank.jpg">.

最美好的祝愿 克里斯

Answer 1

施工

<img src="">

无效。切勿使用它。

这是无效的，因为空 url 表示当前页面的 url。但当前页面是 HTML 文档，而不是图像。浏览器可以再次查询当前页面并尝试将其用作图像（参见此页面）。

Answer 2

function replaceSrc()
{

    var images = document.getElementsByTagName('img');

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

        if(img.src.length == 0)
        {
            img.src = 'blank.jpg';
        }
    }
}


window.onload = replaceSrc;

或者如果您想为该事件添加多个处理程序：

document.addEventListener('load', replaceSrc, false) //W3C
document.attachEvent('onload', replaceSrc); //IE

使用 jQuery

   $(document)
     .ready(function() { $('img')
                             .filter(function(){ return this.src.length == 0 })
                                 .each(function () { this.src = 'blank.jpg'})  });

编辑：

我意识到您可能想在图像加载之前设置 src 属性，因此我更改了代码以在文档的加载事件上触发，该事件发生在图像开始加载之前。

Answer 3

使用jQuery！这很容易。

$('img').attr('src','new-image-name.jpg')

这会将每个

src

标签的

img

属性设置为“new-image-name.jpg”。

Answer 4

使用 jQuery，这会在页面加载时将所有具有空白 src 属性的 img 元素的 src 属性设置为“blank.jpg”。

$.ready(function() {
  $("img[src='']").attr("src", "blank.jpg");
});

Answer 5

您可以使用此脚本。

# Script AddImage.txt
var string pagefile, image, html
# Read in the page file.
cat $pagefile > $html
# Replace all instances of "<img src="blank.jpg">" with the specified image.
while ( { sen -r -c "^<img src=&\>^" $html } > 0 )
    sal -r -c "^<img src=&\>^" ("<img src=\""+$image+"\">") $html > null
# Write page back.
echo $html > { echo $pagefile }

脚本采用biterscripting。将脚本保存在文件“C:/Scripts/AddImage.txt”中，使用此命令运行它。

script "C:/Scripts/AddImage.txt" pagefile("/path/to/page.html") image("blank.jpg")

它将用“blank.jpg”替换之前的图像。

Answer 6

使用 JQuery，您可以使用以下代码简单地解决您的问题。

$(function(){
   $("img[src='']").attr("src", "blank.jpg");
});

Answer 7

使用 dom 操作从 API 数据中替换图像（如果为 null）

const images = document.getElementsByTagName('img');
        for(const img of images){
            const src = img.getAttribute('src');
            if(src === "null" && strGender === "Male"){
                img.src = "img/placeholder-male.jpg";
            } else if(src === "null" && strGender === "Female"){
                img.src = "img/placeholder-female.jpg"
            }
        }