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

【问题标题】：How to replace all empty <img src=""> on a page with JavaScript on dom loaded?如何用加载的 dom 上的 JavaScript 替换页面上的所有空 <img src="">？
【发布时间】：2011-03-17 03:35:16
【问题描述】：

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

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

<img src="blank.jpg">.

最好的祝愿克里斯

【问题讨论】：

有什么理由不使用 JQuery？
是的——我们不想用其他框架使项目过载。我们已经在广泛的原型JS中使用。

标签： javascript html dom replace

【解决方案1】：

构造<img src=""> 无效。永远不要使用它。

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

【讨论】：

是的。在最坏的情况下，这将触发对同一（主）页面的多次调用。（达到每日投票上限，否则 +1）

【解决方案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 属性，因此我更改了代码以触发文档的加载事件，该事件发生在图像开始加载之前。

【讨论】：

【解决方案3】：

使用jQuery！这很容易。

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

这会将每个img 标签的src 属性设置为'new-image-name.jpg'。

【讨论】：

【解决方案4】：

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

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

【讨论】：

【解决方案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”替换之前的图像。

【讨论】：

【解决方案6】：

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

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

【讨论】：