处理ajax数据;数据渲染(细节)
AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术。
什么是 AJAX ?
AJAX = 异步 JavaScript 和 XML。
AJAX 是一种用于创建快速动态网页的技术。
通过在后台与服务器进行少量数据交换,AJAX 可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。
传统的网页(不使用 AJAX)如果需要更新内容,必需重载整个网页面。
有很多使用 AJAX 的应用程序案例:新浪微博、Google 地图、开心网等等。
// ajax模板 数据的处理 $.ajax({ method: 'POST', //POST GET url: window.BASE_URL + 'api/v1/coupon/getcoupons', //地址 contentType: 'application/x-www-form-urlencoded', async: true, //异步true 同步false dataType: "json", data: { parameter: 1, }, success: function(data) { console.log("成功"); var html = '' //先判断 防止数据为空 if(data.data != null && data.data.promotionList != null && data.data.promotionList.length != 0) { // 处理数据 html = data } else { //数据不存在 要在页面显示数据为空 用户体验度很重要 1 html += '<div style="background: #fff;" class="nodata" style="display: none;">' + '<p style="text-align: center; line-height: 40px; font-size: 12px;">没有相关的数据</p>' + '</div>' // 2 html += '<div style="background: #F4F4F4;" class="nodata" style="display: none;">' + '<img style="width: 100%; display: block; height: auto; max-width: 100%;" src="https://s10.mogucdn.com/p2/161213/upload_74hhee883cbf190e3di6cljk23679_514x260.png"/>' + '<p style="text-align: center; line-height: 40px; font-size: 12px;">没有相关的数据</p>' + '</div>' } }, error: function(e) { //接口错误,要提示出来,早发现,早修复 console.log("服务器错误"); } });
如果真的不知道将来要做什么,索性就先做好眼前的事情。只要今天比昨天过得好,就是进步。长此以往,时间自然会还你一个意想不到的未来。
生活像一个杯子。一开始,里面是空的,之后,要看你怎么对待它。如果你只往不如意的方面想,那么你最终辉得到一杯苦水。如果你往好的方面想,那么你最终会得到一杯清泉。
版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
生活像一个杯子。一开始,里面是空的,之后,要看你怎么对待它。如果你只往不如意的方面想,那么你最终辉得到一杯苦水。如果你往好的方面想,那么你最终会得到一杯清泉。
版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。