Jquery - порядок вставки элементов

158

12 августа 2019, 19:40

Почему </details> вставляется раньше чем user?

function renderGroup(group) {
                var body = $("body");
                body.append("<details open='open'><summary>" + group.name + "</summary>");
                for (var i = 0; i < group.users.length; i++){
                    body.append("user");
                }
                body.append("</details>");
            }

На выходе:

<body>
<details open="">
<summary>1</summary>
</details>
useruser
<details>
<summary>2</summary>
</details>
useruser
</body>

Answer 1

Дело в том, что когда вы пишете body.append("<details open='open'><summary>" + group.name + "</summary>"); браузер автоматически добавляет закрывающий тег. Для того чтобы этого избежать лучше делать так:

function renderGroup(group) { 
    var body = $('body'); 
    var details = '<details open="open"><summary>' + group.name + '</summary>'; 
    for (var i = 0; i < group.users.length; i++){ 
        details += group.users[i]; 
    } 
    details += '</details>'; 
    body.append(details); 
}