作为一个前端开发，在日常工作中，会不断的请求接口，调用接口，再对接口的数据进行一定的处理，渲染在前端界面，尤其是在今天前后端分离的时代，这项技能是每个前端开发必备~
这里就简单的记录工作之中遇到的一些常见的对数据处理的方法，今天要说的是遇到了数组格式的图片的时候，该怎么处理。
data.json:
{ "pics": ["img/p15.png", "img/p16.png","img/p17.png"] }
代码示例：
<!DOCTYPE HTML> <html xmlns:th="http://www.thymeleaf.org"> <head> <title>jQuery数据处理（1）：图片数组的渲染</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> </head> <body> <div class="pics"></div> </body> <script type="text/javascript"> $.ajax({ url: "data.json", type: 'GET', dataType: 'json', success: function(data) { //图片数组的渲染 var srcHtml = ''; $.each(data.pics, function(i, item) { srcHtml += '<img src="' + item + '"/>'; }) $(".pics").html(srcHtml) } }); </script> </html>
好的，打开浏览器，效果如下。
