如何替換所有空的<img src="">在 dom 上加載了 JavaScript 的頁面上？

Question

我需要一個 function，它在加載 DOM 時啟動。

在我的 HTML 頁面中有幾個空的圖像標簽，比如我想在加載所有內容時將圖像名稱添加到 src-property 中以獲得類似的東西

<img src="blank.jpg">.

最良好的祝願克里斯

Answer 1

構造<img src="">無效。 永遠不要使用它。

它無效，因為空網址表示當前網頁的網址。 但是當前頁面是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')

這會將每個img標記的src屬性設置為'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"
            }
        }