如何将项目添加到无序列表 使用jQuery

Question

在我的json响应中，我想使用$ .each遍历它，然后将项目附加到<ul></ul>元素。

    $.each(data, function(i, item) {

        // item.UserID
        // item.Username

     }

我想添加一个

• ，并创建一个链接到用户页面的href标签。

Answer 1

最有效的方法是创建一个数组并将其附加到dom一次。

您可以通过丢失字符串中的所有字符串concat使它变得更好。要么多次推送到数组，要么使用+ =构建字符串，然后推送，但是对于某些人来说，读取起来会有点困难。

同样，您也可以将所有项目包装在一个父元素（在本例中为ul）中，并将其附加到容器中以实现最佳性能。只需在每个按钮之前和之后按’
<ul>'和，'</ul>'然后附加到div。

data = [

{

  "userId": 1,

  "Username": "User_1"

},

{

  "userId": 2,

  "Username": "User_2"

}

];



var items = [];



$.each(data, function(i, item) {



  items.push('<li><a href="yourlink?id=' + item.UserID + '">' + item.Username + '</a></li>');



}); // close each()



$('#yourUl').append(items.join(''));


<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<ul id="yourUl">

</ul>