快捷導(dǎo)航

JavaScrip實(shí)現(xiàn)PHP print_r的數(shù)功能（三種方法）

更新時(shí)間：2013年11月12日 15:43:41 作者：

PHP print_r的函數(shù)很好用，可以用來(lái)打印數(shù)組、對(duì)象等的結(jié)構(gòu)與數(shù)據(jù)，可惜JavaScript并沒(méi)有原生提供類似的函數(shù)。不過(guò)我們可以試著自己來(lái)實(shí)現(xiàn)這個(gè)函數(shù)，下面提供一些方法與思路

方法一

復(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選中是否為空的實(shí)例
下面小編就為大家?guī)?lái)一篇CheckBox多選取值及判斷CheckBox選中是否為空的實(shí)例。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2017-10-10
javascript實(shí)現(xiàn)日期格式轉(zhuǎn)換
這篇文章主要介紹了javascript實(shí)現(xiàn)日期格式轉(zhuǎn)換，非常的簡(jiǎn)單實(shí)用，項(xiàng)目中經(jīng)?？梢杂玫?，這里推薦給大家
2014-12-12
JS實(shí)現(xiàn)二維數(shù)組元素的排列組合運(yùn)算簡(jiǎn)單示例
這篇文章主要介紹了JS實(shí)現(xiàn)二維數(shù)組元素的排列組合運(yùn)算,結(jié)合實(shí)例形式分析了javascript針對(duì)二維數(shù)組的遍歷、排列組合運(yùn)算等相關(guān)操作技巧,需要的朋友可以參考下
2019-01-01
如何利用原生JS實(shí)時(shí)監(jiān)聽(tīng)input框輸入值
這篇文章主要介紹了如何利用原生JS實(shí)時(shí)監(jiān)聽(tīng)input框輸入值問(wèn)題，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。如有錯(cuò)誤或未考慮完全的地方，望不吝賜教
2023-01-01
JS中去掉if...else的多種方法
在JavaScript編程中,過(guò)多的if...elseif...else語(yǔ)句可能導(dǎo)致代碼難以維護(hù),可以通過(guò)switch語(yǔ)句、對(duì)象字面量、函數(shù)映射、數(shù)組或映射對(duì)象分發(fā)、提前返回以及使用數(shù)組的find方法來(lái)優(yōu)化這種復(fù)雜的條件判斷,提高代碼的可讀性和維護(hù)性,下面就來(lái)介紹一下
2024-09-09
JS實(shí)現(xiàn)移動(dòng)端上下滑動(dòng)一次一屏
這篇文章主要為大家詳細(xì)介紹了JS實(shí)現(xiàn)移動(dòng)端上下滑動(dòng)一次一屏，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2021-06-06
微信小程序開(kāi)發(fā)自定義tabBar實(shí)戰(zhàn)案例(定制消息99+小紅心)
一定的需求情況下無(wú)法使用小程序原生的tabbar的時(shí)候,需要自行實(shí)現(xiàn)一個(gè)和tabbar功能一模一樣的自制組件,下面這篇文章主要給大家介紹了關(guān)于微信小程序開(kāi)發(fā)自定義tabBar(定制消息99+小紅心)的相關(guān)資料,需要的朋友可以參考下
2022-12-12
JavaScript 另類遍歷數(shù)組實(shí)現(xiàn)代碼
JavaScript 另類遍歷數(shù)組實(shí)現(xiàn)代碼，大家可以看下。
2009-10-10
js removeChild 方法深入理解
下面小編就為大家?guī)?lái)一篇js removeChild 方法深入理解。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧
2016-08-08
JS實(shí)現(xiàn)簡(jiǎn)單的點(diǎn)贊與踩功能示例
這篇文章主要介紹了JS實(shí)現(xiàn)簡(jiǎn)單的點(diǎn)贊與踩功能,涉及javascript針對(duì)頁(yè)面元素動(dòng)態(tài)操作相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下
2018-12-12