Question

我正在尝试做这样的事情：

        var size = skillsArray.length;
        for (i = 0; i < size; i++) {
            var divString = "'#Skill" + i +"'";
            $(divString).append(skillsArray[i]);
        }

为了开始我的原型，skillsArray有5个值。所以我的javascript是这样的：

        $('#Skill0').append(skillsArray[0]);
        $('#Skill1').append(skillsArray[1]);
        $('#Skill2').append(skillsArray[2]);
        $('#Skill3').append(skillsArray[3]);
        $('#Skill4').append(skillsArray[4]);

我的HTML就是这样：

        <div id='Skill0'></div>
        <div id='Skill1'></div>
        <div id='Skill2'></div>
        <div id='Skill3'></div>
        <div id='Skill4'></div>

一切正常。

现在我想使用更大的动态大小的数组，我想使用循环。

所以我的第一步是在一个javascript循环中编写html div标签，它起作用了：

 for (i=0; i<size; i++)
 {
   html += "<div id='Skill" + i + "'></div>";
 }

在我尝试第2步之前，这是我的问题所在，它确实显示了前5种技能，并且之后的每项技能都只是空白。（可以预料，因为我还没有更新我的javascript来附加到每个div，它仍然只做了前5个。）

所以，我准备尝试第2步并为追加使用for循环。我怎样才能做到这一点？我在顶部粘贴的代码并没有填充任何内容。

提前感谢您的帮助！ -Holly

Answer 1

尝试删除此行中的单引号：var divString = "'#Skill" + i +"'";，如下所示：

var divString = "#Skill" + i;

Answer 2

删除选择器字符串中的单引号：

var divString = "#Skill" + i;

Answer 3

你可以试试这个

$("div[id^='Skill']").each(function(i) {
    $(this).append(skillsArray[i]);
});

Answer 4

在同一个循环中完成所有事情：

var size = skillsArray.length;
for (i = 0; i < size; i++) {
    // create a div
    var $elem = $("<div id='Skill" + i + "'></div>");

    // append the skills to div
    $elem.append(skillsArray[i]);

    // append the div to body (or wherever)
    $('body').append($elem);
}

如何附加到使用jquery在for循环中动态创建的div名称？

4 个答案: