我們以前在前端遍歷ajax拿到的數據一般都是用for或其他方式遍歷，這樣做麻煩且費事，效率不高，下面提供一個函數，只需調用函數即可把數據遍歷出來，方便高效。
html代碼：
<html>
<head><script type="text/javascript" src="./jquery.js"></script>
</head>
<body><qweewq><ul><li>{list.name}</li> <li>{list.info}</li> <!-- <li>{name}</li><li>{info}</li> --></ul></qweewq><a href="#">asd</a>
</body>
</html>jquery函數：
/*把josn數據遍歷到html頁面中author:程威明參數 ：dom:包圍需要遍歷的html內容的標簽（名稱自定義，盡量復雜，不可跟常用的html標簽名相同）data:ajax返回的json數據 (必須由ajax返回且類型為json) data_type:數據格式（1，2），兩種:1：{"status":0,"name":["1","2","3"],"info":["a","b","c"]}2：{"status":0,"list":[{"name":"1","info":"a"},{"name":"2","info":"b"},{"name":"3","info":"c"}]}如果是格式2，html代碼中的標識格式必須為{list.name}set_cookie:是否把數據保存到cookie（默認為false，不保存）,保存的格式為{"name":[1,2,3],"info":["a","b","c"]}cookie_name:存儲cookie的name，若數據類型為1即默認為cookie_json，若數據類型為2即默認為數據列表的key，如上面數據類型例子中的list
*/removeCookie('firstdom');//刷新頁面即清除這個cookie$.extend({'eachjson':function(dom,data,data_type,set_cookie,cookie_name){/**-------- 這部分都是為了方便用于ajax分頁 ----------------------------**//**- [ajax分頁](http://blog.csdn.net/codercwm/article/details/51508848) ---**/if(!getCookie('firstdom'))//把原始的html代碼存入cookie{var firstdom = htmlEncode($(dom).html());setCookie('firstdom',firstdom);}if(getCookie('firstdom'))//在cookie中獲得{$('qweewq').html(getCookie('firstdom'));}/**--------------------------------------------------**/var get_html = $(dom).html(); //獲取自定義標簽包圍的html內容var json_length = 0;if(data_type==1){var html_s = each_json_data_type1(get_html,json_length,data,set_cookie); //如果為數據格式為1即調用函數1，否則調用函數2}else{var html_s = each_json_data_type2(get_html,json_length,data,set_cookie);}$(dom).html(html_s); //把原html替換為已有數據的html}});function each_json_data_type1(get_html,json_length,data,set_cookie,cookie_name)
{if(set_cookie){var cookie_json = JSON.stringify(data).replace(/"status":(.*?),/,'')if(!cookie_name){var cookie_name = 'cookie_json';}setCookie(cookie_name,cookie_json);}for(var check_length in data){if(data[check_length].length>json_length){json_length = data[check_length].length;}}var html_s = '';for(var i=0;i<json_length;i++){var html_one = get_html;$.each(data,function(k,v){ //遍歷json中的key和valueif(v[i]){var val = v[i];}else{var val = '';}html_one = html_one.replaceAll('{'+k+'}',val); //把html中的標識替換為json數據中的內容});html_s += html_one;}return html_s;
}function each_json_data_type2(get_html,json_length,data,set_cookie,_cookie_name)
{/*** 作用：例如：把html代碼中的{list.name}中的list匹配出來 *******/var preg = /{(.*?)\./; var key_list = get_html.match(preg);var key = key_list[1];/********* end ********************/json_length = data[key].length;var html_s = '';/* 作用：把key中的數組中的json取出放到對應的地方 *****************/var cookie_val = new Array();var cookie_key = new Array();var m = 0;$.each(data[key],function(index_key,value){var html_one = get_html;var n = 0;cookie_val_one = new Array();$.each(value,function(k,v){ //遍歷json數組中的key和valueif(v){var val = v;}else{var val = '';}html_one = html_one.replaceAll('{'+key+'.'+k+'}',val); //把html中的標識替換為json數據中的內容//把k和v保存到數組中if(set_cookie) {if(i=(json_length-1)){cookie_key[n] = k;}cookie_val_one[n] = v;}n++;});if(set_cookie) cookie_val[m] = cookie_val_one; //把v保存成二維數組html_s += html_one;m++;});if(set_cookie){var cookie_json = '{';var len = cookie_key.length;for(var j=0;j<len;j++){var cookie_value = new Array();for(var i=0;i<cookie_val.length;i++){cookie_value[i] = cookie_val[i][j];}cookie_json += ',"'+cookie_key[j]+'":'+'["'+cookie_value.join('","')+'"]';}cookie_json += '}';var newstr = cookie_json.split("");newstr[1] = ''; //把第一個‘,’刪掉cookie_json = newstr.join("");if(!cookie_name){var cookie_name = key;}setCookie(cookie_name,cookie_json);}/* end ************************/return html_s;
}//設置或添加cookie
function setCookie(name,value)
{ var str = name + "=" + value;document.cookie = str;
}//獲取cookie
function getCookie(name)
{ //cookie中的數據都是以分號加空格區分開 var arr = document.cookie.split("; "); for(var i=0; i<arr.length; i++){ if(arr[i].split("=")[0] == name){ return arr[i].split("=")[1]; }}//未找到對應的cookie則返回空字符串 return '';
}//刪除cookie
function removeCookie(name)
{ document.cookie = name+"=;expires="+(new Date(0)).toGMTString();
}//字符竄替換所有
String.prototype.replaceAll = function(s1,s2)
{ return this.replace(new RegExp(s1,"gm"),s2);
}//html字符編碼
function htmlEncode(str)
{ var s = "";if (str.length == 0) return "";s = str.replace(/&/g, ">");s = s.replace(/</g, "<");s = s.replace(/>/g, ">");s = s.replace(/ /g, " ");s = s.replace(/\'/g, "'");s = s.replace(/\"/g, "");s = s.replace(/\n/g, "");return s;
} //html字符解碼
function htmlDecode(str)
{ var s = "";if (str.length == 0) return "";s = str.replace(/>/g, "&");s = s.replace(/</g, "<");s = s.replace(/>/g, ">");s = s.replace(/ /g, " ");s = s.replace(/'/g, "\'");s = s.replace(/"/g, "\"");s = s.replace(/<br>/g, "\n");return s;
}test.php中的代碼：
<?php
//echo '{"status":0,"name":["aa","bb","cc","dd","ee"],"info":[1,2,3,4,5]}';
echo '{"status":0,"list":[{"name":"1","info":"a"},{"name":"2","info":"b"},{"name":"3","info":"c"}]}';ajax代碼：
$.ajax({url:'http://localhost/test.php',type:'post',dataType:'json', //必須為jsondata:{data:1},success:function(res){$.eachjson('qweewq',res,2,1); //調用函數（qweewq為包圍要遍歷的html代碼的自定義標簽）var aaa = getCookie('cookie_json'); //獲取cookie中的數據var bbb = eval("(" + aaa + ")"); //轉成json對象$('a').html(bbb.name[0])}});最后瀏覽器中輸出的結果為：
)
)
