[{"name":"体验区统计","numb":0},{"name":"test909","numb":0},{"name":"test910","numb":0},{"name":"111","numb":0},{"name":"test","numb":0},{"name":"test11111","numb":0},{"name":"记忆区统计","numb":0}]
代码:
<!DOCTYPE HTML> <html xmlns:th="http://www.thymeleaf.org"> <head> <title>复选框checkbox自定义样式</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link rel="stylesheet" href="https://cdn.bootcss.com/twitter-bootstrap/4.3.1/css/bootstrap.min.css"> <script src="https://cdn.bootcss.com/jquery/3.4.1/jquery.min.js"></script> <script src="https://cdn.bootcss.com/twitter-bootstrap/4.3.1/js/bootstrap.min.js"></script> <style> </style> </head> <body> <!-- 中间部分 --> <div class="contScend"> </div> </body> <script type="text/javascript"> $.ajax({ url: "test.json", type: 'GET', dataType: 'json', success: function(data) { var html = ""; html += '<div>'; $.each(data, function(i, item) { // html += '<span>' + item.name + ':' + item.numb + '人' + '</span>'; if (i != 0 && (i + 1) % 4 == 0) { html += '<br>'; } }); html += '</div>'; $(".contScend").html(html); } }); </script> </html>