Question

创建标签后，此循环始终为空<li></li>。为什么是这样？我该如何解决？

P.S。循环变为2次（我检查过）。

function a(){
    for (var i = 0; i < list.length; i++) {
        $("#flist").append('<li id="file' + i '"<li/>');
        $("#flist").append('<li id="file' + i '_info"<li/>');
    }
}

HTML结果：

<ul id="flist" style="display: block;">
    <li id="file0">...</li>
    <li></li>
    <li id="file0_info"></li>
    <li></li>

    <li id="file1">...</li>
    <li></li>
    <li id="file1_info"></li>
    <li></li>
</ul>

Answer 1

这是因为您在开场>标记上遗漏了li，它应该是</li>，而不是<li/>。

function a(){
    for (var i = 0; i < list.length; i++) {
        $("#flist").append('<li id="file' + i + '"></li>');
        $("#flist").append('<li id="file' + i + '_info"></li>');
    }
}

另请注意，生成单个HTML字符串并将其附加到DOM一次会更快：

function a() {
    var html = '';
    for (var i = 0; i < list.length; i++) {
        html += '<li id="file' + i + '"></li><li id="file' + i + '_info"></li>';
    }
    $('#flist').append(html);
}

Answer 2

试试这个：

function a(){
   for (var i = 0; i < list.length; i++) {
       $("#flist").append('<li id="file' + i '"></li>');
       $("#flist").append('<li id="file' + i '_info"></li>');
   }
}

追加后清空<li>标签

2 个答案: