javascript – 获取图片元素的当前图像源

HTMLImageElement具有currentSrc属性,因此我们可以获取img元素的当前源.在使用srcset定义多个可能的源时很有用.

似乎没有相应的HTMLPictureElement.

还有另一种方法,我们可以用Javascript找到图片元素的当前来源吗？

解决方法:

您可以访问图片元素中img元素的currentSrc以获取应用的图像.

在下面的演示中(如果您使用浏览器的全宽桌面),currentSrc将是http://placehold.it/600×100图像.

window.onload = function() {
  const picture = document.getElementById('pictureEl');
  const currentSource = document.getElementById('currentSource');
  currentSource.innerText = picture.getElementsByTagName('img')[0].currentSrc;
}

<picture id="pictureEl">
 <source srcset="http://placehold.it/600x100?text=Source" media="(min-width: 300px)">
 <img src="http://placehold.it/300x100?text=Img">
</picture>
<div id="currentSource"></div>

标签：javascript,responsive-images,srcset
来源： https://codeday.me/bug/20191008/1871087.html