使用javascript打印JSON数据使用Javascript打印JSON数据转发请标明原文链接：http://www.cnblogs.com/misuoka/p/4081750.html
废话不扯，直入主题。
一般来说，Chrome和Firefox两款浏览器已提供我们强大的调试功能，可以在网络请求选项中查看Ajax请求页返回的JSON数据。但如果数据较为复杂，就不易于观看。
例如：
1.Chrome中的情况:
2.Firefox中的情况：
所以，我们可以编写一个函数来把JSON对象以友好的格式打印到HTML页面中，以便观看。
效果如下：
实现代码：
/** 输出空格函数 */function blank(num) { var res = ''; for (var i = 0; i < num; i++) { res += ' '; } return res;} /** 计算JSON对象数据个数 */function jsonLen(jsonObj) { var length = 0; for (var item in jsonObj) { length++; } return length;}/** 解析JSON对象函数 */function PRintObj(obj) { // JSON对象层级深度 deep = (typeof(deep)=='undefined') ? 0: deep; var html = "Array\n"; // 返回的HTML html += kong(deep) + "(\n"; var i = 0; // JSON对象，不能使用.length获取数据的个数，故需自定义一个计算函数 var len = typeof(obj) == 'array' ? obj.length : jsonLen(obj); for(var key in obj){ // 判断数据类型，如果是数组或对象，则进行递归 // 判断object类型时，&&jsonLen(obj[key])是由于 // 1、值（类似：email:）为null的时候，typeof(obj[key])会把这个key当做object类型 // 2、值为null的来源是，数据库表中某些字段没有数据，查询之后直接转为JSON返回过来 if(typeof(obj[key])=='array'|| (typeof(obj[key])=='object' && jsonLen(obj[key]) > 0) ){ deep += 3; html += kong(deep) + '[' + key + '] => '; // 递归调用本函数 html += printObj(obj[key],deep); deep -= 3; }else{ html += kong(deep + 3) + '[' + key + '] => ' + obj[key] + '\n'; } if (i == len -1) { html += kong(deep) + ")\n"; }; i++; } return html;}/** 向HTML页面追加打印JSON数据 */function p_Obj(obj) { var div = document.getElementById('print-json-html'); if (div != null) { document.body.removeChild(div); }; var node = document.createElement("div");//创建一个div标签 node.id = 'print-json-html'; node.innerHTML = '<pre>' + printObj(obj) + '</pre>'; document.body.appendChild(node);}