获取srcset图像已下载

Question

如何从浏览器下载实际图像:

<img src="small.jpg" srcset="small.jpg 200w, large.jpg 400w">

如果我的屏幕宽度大于400像素,则会下载大图像.我在哪里可以获得路径？以下返回"small.jpg".

<script>
   var i = $('img').attr('src');
   alert(i);  //This returns "small.jpg"
</script>

Answer 1

.currentSrc是您正在寻找的属性.
在jQuery中,那就是.prop("currentSrc").

它是HTML 5标准的一部分,因此理论上每个支持的浏览器.srcset也应该支持.currentSrc.
您可以使用以下命令测试浏览器是否支持它:

var supported = 'currentSrc' in new Image;

对于较旧的浏览器,我建议您回退.src,这应该是正确的值,因为srcset也不会支持.

JS:

var img = document.querySelector('img');
var src = img.currentSrc || img.src;

jQuery的:

var img = $('img');
var src = img.prop('currentSrc') || img.prop('src');