JavaScrip實現(xiàn)PHP print_r的數(shù)功能(三種方法)
更新時間:2013年11月12日 15:43:41 作者:
PHP print_r的函數(shù)很好用,可以用來打印數(shù)組、對象等的結(jié)構(gòu)與數(shù)據(jù),可惜JavaScript并沒有原生提供類似的函數(shù)。不過我們可以試著自己來實現(xiàn)這個函數(shù),下面提供一些方法與思路
方法一
function print_r(theObj) {
var retStr = '';
if (typeof theObj == 'object') {
retStr += '<div style="font-family:Tahoma; font-size:7pt;">';
for (var p in theObj) {
if (typeof theObj[p] == 'object') {
retStr += '<div><b>['+p+'] => ' + typeof(theObj) + '</b></div>';
retStr += '<div style="padding-left:25px;">' + print_r(theObj[p]) + '</div>';
} else {
retStr += '<div>['+p+'] => <b>' + theObj[p] + '</b></div>';
}
}
retStr += '</div>';
}
return retStr;
}
方法二
$(document).ready(function(){
$('#btn').click(function(){
var jsonStr = $('#jsonData').val();
var json = eval('('+jsonStr+')');
(function(){
var print_r = function(o, depth) {
var result = '';
depth || (depth=1);
var indent = new Array(4*depth+1).join(' ');
var indentNext = new Array(4*(depth+1)+1).join(' ');
var indentNextTwo = new Array(4*(depth+2)+1).join(' ');
var tmp = '';
var type = typeof o;
switch(type) {
case 'string':
case 'number':
case 'boolean':
case 'undefined':
case 'function':
tmp += indent + indentNext + o + "\n";
break;
case 'object':
default:
for(var key in o) {
tmp += indentNextTwo + '[' + key + '] = ';
tmp += print_r(o[key], (depth+1));
}
}
result += type + "\n";
result += indentNext + '(' + "\n";
result += tmp;
result += indentNext + ')' + "\n";
return result;
};
alert(print_r(json));
}(json));
});
});
方法三
print_r:function(theObj) {
var retStr = '';
if (typeof theObj == 'object'||typeof theObj == 'array') {
retStr += '<div style="font-family:Tahoma; font-size:7pt;">';
for (var p in theObj) {
if (typeof theObj[p] == 'object' || typeof theObj[p] == 'array') {
retStr += '<div><b>['+p+'] => ' + typeof(theObj) + '</b></div>';
retStr += '<div style="padding-left:25px;">' + XFUPLOAD.Tools.print_r(theObj[p]) + '</div>';
} else {
retStr += '<div>['+p+'] => <b>' + theObj[p] + '</b></div>';
}
}
retStr += '</div>';
}
$("body").append(retStr);
}
復(fù)制代碼 代碼如下:
function print_r(theObj) {
var retStr = '';
if (typeof theObj == 'object') {
retStr += '<div style="font-family:Tahoma; font-size:7pt;">';
for (var p in theObj) {
if (typeof theObj[p] == 'object') {
retStr += '<div><b>['+p+'] => ' + typeof(theObj) + '</b></div>';
retStr += '<div style="padding-left:25px;">' + print_r(theObj[p]) + '</div>';
} else {
retStr += '<div>['+p+'] => <b>' + theObj[p] + '</b></div>';
}
}
retStr += '</div>';
}
return retStr;
}
方法二
復(fù)制代碼 代碼如下:
$(document).ready(function(){
$('#btn').click(function(){
var jsonStr = $('#jsonData').val();
var json = eval('('+jsonStr+')');
(function(){
var print_r = function(o, depth) {
var result = '';
depth || (depth=1);
var indent = new Array(4*depth+1).join(' ');
var indentNext = new Array(4*(depth+1)+1).join(' ');
var indentNextTwo = new Array(4*(depth+2)+1).join(' ');
var tmp = '';
var type = typeof o;
switch(type) {
case 'string':
case 'number':
case 'boolean':
case 'undefined':
case 'function':
tmp += indent + indentNext + o + "\n";
break;
case 'object':
default:
for(var key in o) {
tmp += indentNextTwo + '[' + key + '] = ';
tmp += print_r(o[key], (depth+1));
}
}
result += type + "\n";
result += indentNext + '(' + "\n";
result += tmp;
result += indentNext + ')' + "\n";
return result;
};
alert(print_r(json));
}(json));
});
});
方法三
復(fù)制代碼 代碼如下:
print_r:function(theObj) {
var retStr = '';
if (typeof theObj == 'object'||typeof theObj == 'array') {
retStr += '<div style="font-family:Tahoma; font-size:7pt;">';
for (var p in theObj) {
if (typeof theObj[p] == 'object' || typeof theObj[p] == 'array') {
retStr += '<div><b>['+p+'] => ' + typeof(theObj) + '</b></div>';
retStr += '<div style="padding-left:25px;">' + XFUPLOAD.Tools.print_r(theObj[p]) + '</div>';
} else {
retStr += '<div>['+p+'] => <b>' + theObj[p] + '</b></div>';
}
}
retStr += '</div>';
}
$("body").append(retStr);
}
相關(guān)文章
CheckBox多選取值及判斷CheckBox選中是否為空的實例
下面小編就為大家?guī)硪黄狢heckBox多選取值及判斷CheckBox選中是否為空的實例。小編覺得挺不錯的,現(xiàn)在就分享給大家,也給大家做個參考。一起跟隨小編過來看看吧2017-10-10
javascript實現(xiàn)日期格式轉(zhuǎn)換
這篇文章主要介紹了javascript實現(xiàn)日期格式轉(zhuǎn)換,非常的簡單實用,項目中經(jīng)??梢杂玫剑@里推薦給大家2014-12-12
JS實現(xiàn)二維數(shù)組元素的排列組合運算簡單示例
這篇文章主要介紹了JS實現(xiàn)二維數(shù)組元素的排列組合運算,結(jié)合實例形式分析了javascript針對二維數(shù)組的遍歷、排列組合運算等相關(guān)操作技巧,需要的朋友可以參考下2019-01-01
微信小程序開發(fā)自定義tabBar實戰(zhàn)案例(定制消息99+小紅心)
一定的需求情況下無法使用小程序原生的tabbar的時候,需要自行實現(xiàn)一個和tabbar功能一模一樣的自制組件,下面這篇文章主要給大家介紹了關(guān)于微信小程序開發(fā)自定義tabBar(定制消息99+小紅心)的相關(guān)資料,需要的朋友可以參考下2022-12-12
JavaScript 另類遍歷數(shù)組實現(xiàn)代碼
JavaScript 另類遍歷數(shù)組實現(xiàn)代碼,大家可以看下。2009-10-10

