[{"clickdate":"2017-10-24","value":"416"},{"clickdate":"2017-10-23","value":"473"},{"clickdate":"2017-10-22","value":"314"},
{"clickdate":"2017-10-21","value":"199"},{"clickdate":"2017-10-20","value":"310"},{"clickdate":"2017-10-19","value":"383"},
{"clickdate":"2017-10-18","value":"315"},{"clickdate":"2017-10-17","value":"281"},{"clickdate":"2017-10-16","value":"213"},
{"clickdate":"2017-10-15","value":"181"},{"clickdate":"2017-10-14","value":"152"},{"clickdate":"2017-10-13","value":"223"},
{"clickdate":"2017-10-12","value":"288"},{"clickdate":"2017-10-11","value":"305"},{"clickdate":"2017-10-10","value":"219"},
{"clickdate":"2017-10-09","value":"173"},{"clickdate":"2017-10-08","value":"91"},{"clickdate":"2017-10-07","value":"82"},
{"clickdate":"2017-10-06","value":"102"},{"clickdate":"2017-10-05","value":"138"},{"clickdate":"2017-10-04","value":"222"},
{"clickdate":"2017-10-03","value":"233"},{"clickdate":"2017-10-02","value":"162"},{"clickdate":"2017-10-01","value":"97"},
{"clickdate":"2017-09-30","value":"122"},{"clickdate":"2017-09-29","value":"157"},{"clickdate":"2017-09-28","value":"209"},
{"clickdate":"2017-09-27","value":"227"},{"clickdate":"2017-09-26","value":"260"},{"clickdate":"2017-09-25","value":"278"},
{"clickdate":"2017-09-24","value":"210"},{"clickdate":"2017-09-23","value":"143"},{"clickdate":"2017-09-22","value":"198"},
{"clickdate":"2017-09-21","value":"211"},{"clickdate":"2017-09-20","value":"242"},{"clickdate":"2017-09-19","value":"215"},
{"clickdate":"2017-09-18","value":"192"},{"clickdate":"2017-09-17","value":"126"},{"clickdate":"2017-09-16","value":"153"},
{"clickdate":"2017-09-15","value":"177"},{"clickdate":"2017-09-14","value":"286"},{"clickdate":"2017-09-13","value":"349"},
{"clickdate":"2017-09-12","value":"321"},{"clickdate":"2017-09-11","value":"316"},{"clickdate":"2017-09-10","value":"220"},
{"clickdate":"2017-09-09","value":"106"},{"clickdate":"2017-09-08","value":"105"},{"clickdate":"2017-09-07","value":"2"},
{"clickdate":"2017-09-06","value":"14"},{"clickdate":"2017-09-05","value":"6"},{"clickdate":"2017-09-04","value":"11"},
{"clickdate":"2017-09-03","value":"15"},{"clickdate":"2017-08-29","value":"1"},{"clickdate":"2017-08-28","value":"4"},
{"clickdate":"2017-08-27","value":"17"},{"clickdate":"2017-08-26","value":"15"},{"clickdate":"2017-08-25","value":"12"},
{"clickdate":"2017-08-24","value":"19"},{"clickdate":"2017-08-23","value":"10"},{"clickdate":"2017-08-20","value":"4"},
{"clickdate":"2017-08-19","value":"16"},{"clickdate":"2017-08-18","value":"17"},{"clickdate":"2017-08-17","value":"18"},
{"clickdate":"2017-08-16","value":"19"},{"clickdate":"2017-08-15","value":"18"},{"clickdate":"2017-08-14","value":"13"}}
今天遇到個問題,對後臺請求到的json數據進行處理,後臺傳過來的數據爲每天的數據量:
我需要按json數據中的月份來分組求每個月份的總值,展示到頁面上:本來如果可以寫後臺代碼,用SQL語句再經過處理就可以得到想要的數據
但是由於後臺不是我寫的,所以只能從後臺取到這些數據,想要正確展示出來就必須要處理一下,貼代碼吧,有註釋
able_json = xmlhttp.responseText; var obj = JSON.parse(table_json); alert(table_json) //從json數據取出月份,不重複的月份,存入新的數組 var mon = []; for (var i = 1; i < obj.length; i++) { var repeat = false; for (var j = 0; j < mon.length; j++) { if (mon[j] == obj[i].clickdate.substring(0,7)) { repeat = true break } } if (!repeat) { //不重複push 結果數組 mon.push(obj[i].clickdate.substring(0,7)) } } //對月份的數組進行遍歷,從整個json數據中遍歷每月份的值求和 var monvalue = []; var one = 0; for(var j = 0;j<mon.length;j++){ var one = 0; for(var i=0;i<obj.length;i++){ if(obj[i].clickdate.substring(0,7) == mon[j]){ one += parseInt(obj[i].value); } } monvalue.push(one); } //把獲取到的兩個數組組合爲一個數組, var json_arr = []; for (var i=0;i<mon.length;i++){ // json_arr[mon[i]] = monvalue[i]; json_arr.push([mon[i],monvalue[i]]); } //循環數組並打印信息 var table1 = "<table id='table1' border='1'>" table1 +="<tr style='font-weight:bold; font-size:15px; background-color:#CCC;'><td>日期</td><td>上網人數</td></tr>"; for(var i =0;i<json_arr.length;i++){ var v = json_arr[i]; table1 += "<tr><td>"+v[0]+"</td><td>"+v[1]+"</td></tr>" } table1 +="</table>"; $("#table_area").html(table1); $("#table1 tr:odd").addClass("trlinebg");
雖然過程麻煩了點,我也知道肯定有簡便點的方法,但是項目很急,本人又是小白一隻,只好這樣先實現,後期再去優化了。請大牛指點