如何自动创建元素？

-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

如何自动创建元素？

回答

相关问题