标签:col plist lis 技术 func 执行 end com 对象
jQuery.each() 函数用于遍历指定的对象和数组。
$.each( object, callback )
参数 | 描述 |
---|---|
object | Object类型 指定需要遍历的对象或数组。 |
callback | Function类型 指定的用于循环执行的函数。 |
通过这个方法可以将工作中遇到的数据列表如商城里面的商品列表等很好的进行循环,简单方便,下面就是我写的一个案例:
当然这个这个数组对象是我自己模拟的,实际工作中我们只需要根据后台给的接口来进行操作。
html:
<div class="index">
<h1>
首页
</h1>
<ul class="shop_box">
</ul>
<button id="btn">点击</button>
</div>
js:
<script> $(function () { var con = [ { name: ‘小王‘, age: 18 }, { name: ‘小张‘, age: 19 }, { name: ‘小李‘, age: 20 }, { name: ‘小何‘, age: 21 }, { name: ‘小陆‘, age: 22 }, ] var html = ‘‘; $.each(con, function (k, v) { // 这里的函数参数是键值对的形式,k代表键名,v代表值 html += ‘<li class="shopBox">‘ + ‘<div class="ShopListName">‘ + con[k].name + ‘</div>‘ + ‘<div class="age">‘ + con[k].age + ‘</div>‘ + ‘</li>‘ }); $(".index").append(html); }) </script>
效果图:
标签:col plist lis 技术 func 执行 end com 对象
原文地址:https://www.cnblogs.com/mica/p/10711970.html