使用jQuery更改所有图像的图像源

Question

我的页面上有一些空的图像标签，图像存储在数据属性中。

在页面加载，我想从数据属性取此值，并将其放置在源...

$('div').each('img').attr('src', $(this).data('src')); 

http://jsfiddle.net/09e9bdwd/

Answer 1

你不正确使用each。在这里，你有一个使用样本

$('div img').each(function() { 
    var $this = $(this); 
    $this.attr('src', $this.data('src')); 
}) 

Answer 2

这是做了正确的方法：

$('div img').each(function(){ 
    $(this).attr('src', $(this).data('src'));  
}); 

DEMO：https://jsfiddle.net/lmgonzalves/09e9bdwd/1/

Answer 3

稍微更快的方法与使用.each()

var images  = document.querySelectorAll("div img"), 
 
    imageCount = document.images.length; 
 

 
for (var i = 0; i < imageCount; i++) { 
 
    images[i].setAttribute("src", images[i].dataset.src); 
 
}

<div> 
 
    <img src="" data-src="http://placehold.it/150x150"> 
 
</div> 
 

 
<div> 
 
    <img src="" data-src="http://placehold.it/150x150"> 
 
</div> 
 

 
<div> 
 
    <img src="" data-src="http://placehold.it/150x150"> 
 
</div>