<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
*{margin: 0;padding: 0;}
section{
width: 1300px;
margin: 0 auto;
background: pink;
overflow: hidden;
}
div{
width: 300px;
height: 400px;
float: left;
border: 2px solid #000;
margin: 10px;
}
a{width: 300px;height: 300px;display: block;}
a img{width: 100%;height: 100%;display: block;}
h2{color: #f00;text-align: center;}
p{font-size: 14px;line-height: 20px;}
</style>
</head>
<body>
<section id="box"</section>
<script>
var arr = [
{
id : 01,
price : 1000,
imgSrc : "http://img13.360buyimg.com/n7/jfs/t1/26123/4/9617/119461/5c8082e6Eb533f3fc/f53c4b1b39676fa9.jpg",
title : "【特步正品官方】满199立减10，满299立减20，满399立减30，火爆开启，点击查看热卖尖货！"
},
{
id : 02,
price : 2000,
imgSrc : "http://img10.360buyimg.com/n7/jfs/t1/58638/8/6570/143338/5d4658d3Eeb186fc7/c979efb1c3cdc95a.jpg",
title : "范华尼 短袖t恤男2019夏季新款潮流修身半袖体恤男士休闲上衣打底衫POLO衫男 深灰 XL！"
},
{
id : 03,
price : 3000,
imgSrc : "http://img10.360buyimg.com/n7/jfs/t1/41293/26/9137/126467/5d29665fEad149728/f5cb00de507f609f.jpg",
title : "范华尼 短袖t恤男2019夏季新款潮流修身9立减20，满399立减30，火爆开启，点击查看热卖尖货！"
},
{
id : 01,
price : 1000,
imgSrc : "http://img13.360buyimg.com/n7/jfs/t1/26123/4/9617/119461/5c8082e6Eb533f3fc/f53c4b1b39676fa9.jpg",
title : "【特步正品官方】满199立减10，满299立减20，满399立减30，火爆开启，点击查看热卖尖货！"
},
{
id : 02,
price : 2000,
imgSrc : "http://img10.360buyimg.com/n7/jfs/t1/58638/8/6570/143338/5d4658d3Eeb186fc7/c979efb1c3cdc95a.jpg",
title : "范华尼 短袖t恤男2019夏季新款潮流修身半袖体恤男士休闲上衣打底衫POLO衫男 深灰 XL！"
},
{
id : 03,
price : 3000,
imgSrc : "http://img10.360buyimg.com/n7/jfs/t1/41293/26/9137/126467/5d29665fEad149728/f5cb00de507f609f.jpg",
title : "范华尼 短袖t恤男2019夏季新款潮流修身9立减20，满399立减30，火爆开启，点击查看热卖尖货！"
},
{
id : 04,
price : 4000,
imgSrc : "http://img11.360buyimg.com/n7/jfs/t1/69679/40/5140/126743/5d32f0f5E7f69253a/37c4dcd5bb5ea2a2.jpg",
title : "【特步正品官方】热卖尖货！"
}
];
var str = "";
for(var i = 0, k = arr.length; i < k; i++){
str += '<div><a href="#"><img src=' + arr[i].imgSrc + " alt=''></a><h2>" + arr[i].price + "</h2><p>" + arr[i].title + "</p></div>";
}
console.log(str);
box.innerHTML = str;
</script>
</body>
</html>