Цикл по данным и создание HTML-элементов с данными

Question

Я получаю данные json из php-скрипта и пытаюсь отобразить данные на веб-странице.Проблема, с которой я сталкиваюсь, заключается в том, что я хочу ограничить количество тегов

в

Answer 1

вы можете использовать forEach с индексом.

html += '<ul class="col-sm-2 list-unstyled"><li><p class="title">Widgets:</p></li>';
data.forEach((widget,i)=>{
    if (i != 0 && (i % limit == 0)) {
        html += '</ul><ul class="col-sm-2 list-unstyled"><li><p class="title">Widgets:</p></li>';
    }
    html += '<li data-desk="' + widget.mReference + '"><a><span class="d-title">' + widget['mDescription'] + '</span></a></li>';
}
)
html += '</ul>';

Answer 2

Лучший способ сделать это - использовать оператор по модулю:

let liTagLimit = 3;
let index = 0;
let html = '<ul id="first-ul">';

for(let key in data){
    //...create li
    index++;
    if(index % liTagLimit == 0){//<----- HERE IS THE TRICK
        html += "</ul><ul>";
    }
html += '</ul>';