如何自動創建元素？

-2

有一項任務是創建幾個img元素併爲它們添加一個src，並立即顯示。我寫了這個：如何自動創建元素？

var mass_id = new Array(); 
for (var i = 0; i < links.length; i++) { 
    var td = document.createElement('img'); 
    td.id = 'img'+i; 
    td.src = links[i]; 
    mass_id.push(td); 
    document.getElementById(td.id).src = links[i]; 
}

links是指向圖像陣列。

但是，如果沒有在開始時<img id='img0'/>增加，我發現了一個錯誤：

"Uncaught TypeError: Cannot set property 'src' of null"

所以，我怎麼能解決這個問題以避免<img id='img0'/>？

來源

2017-02-18 Anton Kovalenko

正試圖將圖片添加到一個容器？也許是一個div？ –

您不能在尚未附加到文檔的元素上使用'document.getElementById'！ –

@JarrodRoberson甚至沒有接近那個問題！ –

的問題是這一行：

document.getElementById(td.id).src = links[i];

你試圖檢索您剛纔從DOM創建的元素，但你沒有在第一時間將其添加到DOM。此外，不需要設置兩次src屬性。您需要將您的虛擬元素添加到DOM中，例如：

document.getElementsByTagName('body')[0].appendChild(td);

請考慮以下工作片段。

var mass_id = new Array(); 
 
var links = ["http://lorempixel.com/50/50/people/?1", "http://lorempixel.com/50/50/people/?2"] 
 
for (var i = 0; i < links.length; i++) { 
 
var td = document.createElement('img'); 
 
td.id = 'img'+i; 
 
td.src = links[i]; 
 
mass_id.push(td); 
 
document.getElementsByTagName('body')[0].appendChild(td); 
 
}

<body></body>

來源

2017-02-18 22:57:23

如何自動創建元素？

回答

相關問題