Html 使用srcset更改图像链接，而不是图像本身？

我想有一个静态的100px缩略图（在所有屏幕尺寸下都是100px），点击该缩略图将显示同一图像的更大版本（取决于屏幕大小）。因此，缩略图实质上是指向

srcset

变体的链接。这可能吗

<a href="/">
  <img src="thumb.jpg">
</a>


<img src="default.jpg" class="thumbnail" srcset="small.jpg 600w, medium.jpg 1000w large.jpg 2000w">

---

您可以添加一个javascript事件侦听器，用于侦听图像上的单击

单击图像时，可以添加

srcset

属性

浏览器将完成其余的工作

示例：

var thumbnail=document.getElementsByClassName（'thumbnail'）[0]；
var srcsetAttribute=document.createAttribute（'srcset'）；
var srcsetValue='0http://placehold.it/200x100 600w，http://placehold.it/300x100 1000w，http://placehold.it/600x100 2000w’；
srcsetAttribute.value=srcsetValue；
函数addSrcset（）{
this.setAttributeNode（srcsetAttribute）；
}
缩略图.addEventListener（'click'，addSrcset，false）
你能提供你的
srcset
变体和断点吗？@Rounin我已经分别用缩略图和
srcset
变体更新了这篇文章