在 for 循环中只创建手风琴的内容

Question

我正在尝试在 for 循环中创建手风琴的内容部分，并预先打印标题。这是我试过的：

$("#right").append(
        "Team Leaders"
        + "<h4>Goals</h4>"
        + "<div><p>"
    );
    for (var i = 0; i < 5; i++) {
        $("#right").append(
            topGoals[i].name
            + ": "
            + topGoals[i].goals
            + "<br>"
        );
    }
    $("#right").append("</p></div>");
    $("#right").accordion();

然而，这并没有奏效。 "Goals"部分确实出现了手风琴header，但是里面的内容是空的，for循环生成的内容出现在手风琴下面。

我以前在 for 循环中创建过手风琴，没有遇到任何问题，但我从未尝试过在循环之外制作标题。我是不是做错了什么？

编辑：

screen.js中的topGoals数组：

var topGoals = getTopFiveGoals(myTeam);

函数在functions.js:

function getTopFiveGoals(team) {
var tempTeam = team.players.slice();
tempTeam.sort(function(a, b) {
    return b.goals-a.goals;
});
tempTeam.splice(5, 15);
return tempTeam;
}

Answer 1

您多次修改 DOM 树，而是在内存中创建一个 dom 元素并附加所有子元素。最后将其附加到活动 DOM 树。在您的代码中，标签未正确关闭，因此无法正确生成。 jQuery会自动关闭<div><p>等未正常关闭的标签

$("#right").append(
        "Team Leaders"
        + "<h4>Goals</h4>"
    );
    var $div = $("<div></div>");
    for (var i = 0; i < 5; i++) {
        $div.append("<p>"+
            topGoals[i].name
            + ": "
            + topGoals[i].goals
            + "</p><br>"
        );
    }
    $("#right").append($div);
    $("#right").accordion();

在 for 循环中只创建手风琴的内容

Create only content of accordion in for loop

javascript

jquery

accordion