js for循环 和 jq $.each() 遍历数组
参考文献 | |
---|---|
1、$.each()方法循环显示购物车列表; | |
2、$.each()方法来循环一个数据列表; |
for 循环:
// 新闻
function inFormation() {
var information = [
{
imge: 'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=3395395711,851131180&fm=27&gp=0.jpg',
title: '资讯要闻标题资讯要闻标题资讯要闻标题资讯要闻标题。',
time: '12.12'
},
{
imge: 'http://i.weather.com.cn/images/shanxi/sxsy/tygjmls/2013/09/26/A63C77AC9AAAD095F467BD72758AE968.jpg',
title: '资讯要闻标题资讯要闻标题资讯要闻标题资讯要闻标题。',
time: '12.12'
},
{
imge: 'http://img3.cache.netease.com/photo/0001/2009-09-14/5J6G8BHU0G5V0001.JPG',
title: '资讯要闻标题资讯要闻标题资讯要闻标题资讯要闻标题。',
time: '12.12'
},
{
imge: 'https://ss1.bdstatic.com/70cFuXSh_Q1YnxGkpoWK1HF6hhy/it/u=3395395711,851131180&fm=27&gp=0.jpg',
title: '资讯要闻标题资讯要闻标题资讯要闻标题资讯要闻标题。',
time: '12.12'
}
];
var MarHtml = [];
for (var i = 0; i < information.length; i++) {
if(information[i]) {
MarHtml += '<a href="videoinfo.html" class="information-hd-item">' +
'<div class="information-img">' +
'<img class="img" alt="information.png" src=" '+ information[i].imge +' "/>' +
'</div>' +
'<div class="information-content">' +
'<div class="information-title ellipsis-2">' + information[i].title + '</div>' +
'<div class="information-time">' + information[i].time + '</div>' +
'</div>' +
'</a>'
}
}
//console.log(MarHtml)
$('#informationList').append(MarHtml);
};
$.each() 循环:
//特点
var trait = [
{
title:"专业服务医药公司",
type:"HKL支持公司作为专业服务医药公司,在整个阿联酋有七十三个医疗中心医疗站,将来能实现用HKL在各医疗站支付服务。"
},
{
title:"底链支撑工业级与金融级",
type:"HKL底链支撑工业级与金融级应用可以实现每秒2000次的TPS 且可持续的交易,支撑表单数据、实时数据等录入。"
},
{
title:"高效率",
type:"HKL网络中的智能合约、认证和数字合规可将个体交易层面的信任整合起来,优化交易各方的关系,极大地提高生态系统中业务互动的效率。"
},
{
title:"与时俱进",
type:"HKL智能合约指导下的活动执行起来将会更迅捷、更高效。并且由于具有分布式特性,HKL区块链可以与时俱进,保持自我可持续能力。"
}
];
var MarHtml = '';
$.each(trait, function(i, val) {
MarHtml += '<div class="trait-list-item">' +
'<p class="color-gray">HKL的特点</p>' +
'<h1>' + trait[i].title + '</h1>' +
'<p>' + trait[i].type + '</p>' +
'</div>'
});
$('#traitListContent').append(MarHtml);
示例:
<div id="active">
<ul class="shop_box">
</ul>
</div>
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
var con = [ {
"image1": "img/1524880084962.jpg",
"shopName": "黑花生(100g*15袋/盒)",
"price": 190,
"markPrice": 200
}, {
"image1": "img/1524879960117.jpg",
"shopName": "黑花生(100g*15袋/盒)",
"price": 190,
"markPrice": 200
}, {
"image1": "img/1524879605807.jpg",
"shopName": "黑花生(100g*15袋/盒)",
"price": 190,
"markPrice": 200
}, {
"image1": "img/1524879181488.jpg",
"shopName": "黑花生(100g*15袋/盒)",
"price": 190,
"markPrice": 200
} ];
var html = "";
$.each(con, function(i,v) {
html += '<li class="shopBox">' +
'<div class="shopListName">' + con[i].shopName +'</div>'
});
$(".shop_box").append(html);
})
</script>
访问数据库:
$(“demo_pull”).inerHTML = str;