Javascript 在HTML5图片集内追加数据

现在我正在做你在这里看到的事情：

$("#wrapper").prepend('<header> <picture> <source media="(max-width: 999px)" srcset="Images/Small/Primary-Logo.png", "Images/Small/2x/Primary-Logo.png 2x", "Images/Small/3x/Primary-Logo.png 3x"> <source media="(min-width: 1000px)" srcset="Images/Big/Primary-Logo.png", "Images/Big/2x/Primary-Logo.png 2x", "Images/Big/3x/Primary-Logo.png 3x"> <img src="" alt="Main Logo"> </picture> </header>')

$（“#包装器”）.prepend（“”）

我的问题是，是否有一种方法可以巧妙地将数据插入到这些源中的每一个源中，而不必预先添加大块文本

例如，将所有srcsets“”保留为空，并通过追加来添加url

我该怎么做呢？

首先：

srcset="Images/Small/Primary-Logo.png", "Images/Small/2x/Primary-Logo.png 2x", "Images/Small/3x/Primary-Logo.png 3x">

应该是：

srcset="Images/Small/Primary-Logo.png, Images/Small/2x/Primary-Logo.png 2x, Images/Small/3x/Primary-Logo.png 3x">

请看一下这个

我可以想出一个解决办法。看看这是否有帮助，也可以随意调整此代码以满足您的需要

var $wrapper = $("#wrapper");

var imageSrcs = {
    "tablet": ["Images/Small/Primary-Logo.png", "Images/Small/2x/Primary-Logo.png 2x", "Images/Small/3x/Primary-Logo.png 3x"],
    "desktop": ["Images/Big/Primary-Logo.png", "Images/Big/2x/Primary-Logo.png 2x", "Images/Big/3x/Primary-Logo.png 3x"]
};

$wrapper.prepend('<header> <picture> <source media="(max-width: 999px)" data-screen="tablet"> <source media="(min-width: 1000px)" data-screen="desktop"> <img src="" alt="Main Logo"> </picture> </header>')

$wrapper.find("[data-screen]").each(function() {

    var screenType = $(this).data("screen");
    $(this).attr({
        'srcset': imageSrcs[screenType].join(", ")
    });
});

var$wrapper=$（“#wrapper”）；
var imageSrcs={
“平板电脑”：[“Images/Small/Primary-Logo.png”、“Images/Small/2x/Primary-Logo.png 2x”、“Images/Small/3x/Primary-Logo.png 3x”]，
“桌面”：[“Images/Big/Primary-Logo.png”、“Images/Big/2x/Primary-Logo.png 2x”、“Images/Big/3x/Primary-Logo.png 3x”]
};
$wrapper.prepend（“”）
$wrapper.find（“[data screen]”）。每个（函数（）{
var screenType=$（this）.data（“screen”）；
$（this.attr）({
“srcset”：imageSrcs[screenType]。加入（“，”）
});
});

是的，您可以通过对

srcsets

@Lshetty how的唯一引用来实现？我在网上找不到关于它的任何信息。我试图替换字符串名称，方法是输入错误的url，然后通过javascript进行更正（尝试延迟加载，直到用户与某个按钮交互）