美文网首页
html页面格式化输出js对象

html页面格式化输出js对象

作者: 叱吒红尘 | 来源:发表于2015-10-29 21:01 被阅读0次

    前端开发中,有时需要在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上输出了

    相关文章

      网友评论

          本文标题:html页面格式化输出js对象

          本文链接:https://www.haomeiwen.com/subject/eqhfhttx.html