Question

我试图通过jQuery生成标记，循环创建n个div s，每个循环索引分配id。当我想通过其div来调用特定的id时如何将#与i连在一起？感谢？

        for(int i=0; i<ListSize; i++) {
            $('<div></div>').attr('id', i).appendTo('#loadMe');

            // Help, how to reference an id that is an index?
            $('<h1></h1>').html(firstName).appendTo('#'+i);    // This doesn't work.
            $('<h1></h1>').html(lastName).appendTo('#'+i);     // This doesn't work.

        }

Answer 1

在循环中构建标记，更改DOM一次：

var container = $([]);

$.each(ListSize, function(i) {
    var div  = $('<div />', {id : 'div' + i}),
        h1_1 = $('<h1 />', {text: firstName}),
        h1_2 = $('<h1 />', {text: lastName});

    container = container.add( div.append(h1_1, h1_2) );
});

$('#loadMe').append( container );

FIDDLE

Answer 2

而不是这样你就可以这样做：

for(int i=0; i<ListSize; i++) {
    //this would create the DOM element with the index as its id
    var iDiv = $('<div id=' + i + '></div>');

    $('<h1>' + firstName + '</h1>').appendTo(iDiv);
    $('<h1>' + lastName + '</h1>').appendTo(iDiv);

    //I usually prefer create the all DOM elements I want then append it to 
    iDiv.appendTo('#loadMe');
}

您还可以在一个行代码中创建整个DOM元素：

for(int i=0; i<ListSize; i++) {
    var iDiv = $('<div id=' + i + '><h1>' + firstName + '</h1><h1>' + lastName + '</h1></div>').appendTo('#loadMe');
}

但如果您坚持使用ID，您可以按照自己的意愿行事：

for(int i=0; i<ListSize; i++) {
    $('<div></div>').attr('id', i).appendTo('#loadMe');

    $('<h1></h1>').html(firstName).appendTo($('#loadMe').find('#'+i));
    $('<h1></h1>').html(lastName).appendTo($('#loadMe').find('#'+i));

}

Answer 3

您的代码适用于我，但将int更改为var。

for(var i=0; i<ListSize; i++) {
    var iDiv = $('<div id=' + i + '></div>');
    iDiv.appendTo('#loadMe');

    $('<h1>' + firstName + '</h1>').appendTo(iDiv);
    $('<h1>' + lastName + '</h1>').appendTo(iDiv);

}

这是现场演示。 http://jsfiddle.net/Ez7ZH/1/

Answer 4

我强烈建议在ID前面加上至少一个字母。除了作为语义改进之外，以数字开头的ID仅在HTML5时有效（有关详细信息，请参阅here）。

jQuery如何引用作为索引的id

4 个答案: