html页面格式化输出js对象

前端开发中,有时需要在html页面格式化输出js对象(服务器响应的json结果等)

var toDisplayInHtml = {
    a: 0,
    b: 'haha',
    result: {
        success: true,
        message: 'ok',
        array: [1, 2],
        obj: {
            d: 12
        }
    }
};
// 将这个对象在html显示成
{
    "a": 0,
    "b": "haha",
    "result": {
        "success": true,
        "message": "ok",
        "array": [
            1,
            2
        ],
        "obj": {
            "d": 12
        }
    }
}

可以这样做:

var objStr = JSON.stringify(toDisplayInHtml, null, 4);

通过指定JSON.stringify()函数的第三个参数,可以控制对象序列化后的字符串的缩进。如果此参数是数值型,代表每层缩进字符数,最大是10(超过10时自动显示10个),同时此参数也可以是字符串

此时,我们只完成了第一步,即将一个对象按照指定缩进序列化,要想在html上显示需要将换行符和空格进行转义:

var html = objStr.replace(/\n/g, '<br>').replace(/\s/g, '&nbsp');

这里简单替换下换行和空白字符,注意要先替换换行,这样就可以在html上输出了

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 135,534评论 19 139
  • http://python.jobbole.com/85231/ 关于专业技能写完项目接着写写一名3年工作经验的J...
    燕京博士阅读 12,228评论 1 118
  • 当春分的阳光带来新鲜的树影和燕子的剪尾妈妈请用七色的彩纸为我折大大小小的船我要放进随身的背包,连同孙悟空和辛巴达…...
    小学生阅读指南阅读 4,916评论 0 3
  • 虚拟影像发展越来越快了,连马爸爸都看好VR技术呢,不仅仅是游戏,未来的影院,购物甚至就医都可以在虚拟空间完...
    密斯特Three阅读 3,017评论 8 3
  • 最近事情有点忙乱,主要在带孩子训练,给家长们反馈上课情况,然后思维导图的作业欠,想看的方格笔记本的书还放床头,想做...
    艺凌老师阅读 3,073评论 0 2