JavaScrip实现PHP print_r的数功能(三种方法)

所属分类: 网络编程 / JavaScript 阅读数: 676
收藏 0 赞 0 分享
方法一
复制代码 代码如下:

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);
}
更多精彩内容其他人还在看

JavaScript this关键字指向常用情况解析

这篇文章主要介绍了JavaScript this关键字指向常用情况解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
收藏 0 赞 0 分享

Vue-cli打包后如何本地查看的操作

这篇文章主要介绍了Vue-cli打包后如何本地查看的操作,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
收藏 0 赞 0 分享

vue cli 3.0通用打包配置代码,不分一二级目录

这篇文章主要介绍了vue cli 3.0通用打包配置代码,不分一二级目录,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
收藏 0 赞 0 分享

JavaScript事件循环及宏任务微任务原理解析

这篇文章主要介绍了JavaScript事件循环及宏任务微任务原理解析,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
收藏 0 赞 0 分享

关于vue-cli3打包代码后白屏的解决方案

这篇文章主要介绍了关于vue-cli3打包代码后白屏的解决方案,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
收藏 0 赞 0 分享

vue打包静态资源后显示空白及static文件路径报错的解决

这篇文章主要介绍了vue打包静态资源后显示空白及static文件路径报错的解决,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
收藏 0 赞 0 分享

vue-cli3访问public文件夹静态资源报错的解决方式

这篇文章主要介绍了vue-cli3访问public文件夹静态资源报错的解决方式,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
收藏 0 赞 0 分享

JS继承实现方法及优缺点详解

这篇文章主要介绍了JS继承实现方法及优缺点详解,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下
收藏 0 赞 0 分享

vue或react项目生产环境去掉console.log的操作

这篇文章主要介绍了vue或react项目生产环境去掉console.log的操作,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
收藏 0 赞 0 分享

解决vue组件没显示,没起作用,没报错,但该显示的组件没显示问题

这篇文章主要介绍了解决vue组件没显示,没起作用,没报错,但该显示的组件没显示问题,具有很好的参考价值,希望对大家有所帮助。一起跟随小编过来看看吧
收藏 0 赞 0 分享
查看更多