如何使用 jQuery 更改图片元素的 srcset 值答案

【问题标题】：How to change picture element srcset value with jQuery如何使用 jQuery 更改图片元素的 srcset 值
【发布时间】：2016-03-27 14:32:51
【问题描述】：

如何使用 jQuery 定位图片元素中源标签的 srcset 属性？更改下面的 xxxxxxxxxx.jpg 和 yyyyyyyyyy.jpg 的值的正确 jQuery 代码是什么？

<picture>
    <!--[if IE 9]><video style="display: none;"><![endif]-->
    <source media="(min-width: 992px)" srcset="/images/bannerAds/xxxxxxxxxx.jpg">
    <source media="(min-width: 768px)" srcset="/images/bannerAds/yyyyyyyyyy.jpg">
    <source srcset="/images/bannerAds/zzzz_320x50.png">
    <!--[if IE 9]></video><![endif]-->
    <img src="data:image/gif;base64,R0lGODlhAQABAAAAADs=" alt="Clio">
</picture>

【问题讨论】：

与更改任何其他元素属性的方式相同。

标签： jquery html image srcset picturefill

【解决方案1】：

嗯，有很多方法可以完成它。老实说，由于各种原因，某人的正确方法可能不适合您。

这是一种方法。

function replace_srcset(target, replacement)
{
    // Search for the target
    $('source[srcset="'+target+'"]').attr('srcset', replacement);
}

replace_srcset('/images/bannerAds/xxxxxxxxxx.jpg', '/images/bannerAds/somethingelse.jpg');

【讨论】：

改变了元素的目标，但它做了应该感谢的事情。

【解决方案2】：

如果您想更改src，那么您想覆盖所有sources。只需删除它们，因为您不使用它们：

$('picture source').remove();

然后正常设置src：

$('img').attr('src', 'your-new-image.jpg');

如果您想通过保持响应来使用多个src，请多次使用 Stephanus 的代码。

【讨论】：