zoukankan      html  css  js  c++  java
  • js实现美化json数据格式

    一、核心方法代码

    //json格式美化
    function prettyFormat(str) {
        try {
            // 设置缩进为2个空格
            str = JSON.stringify(JSON.parse(str), null, 2);
            str = str
                .replace(/&/g, '&')
                .replace(/</g, '&lt;')
                .replace(/>/g, '&gt;');
            return str.replace(/("(\u[a-zA-Z0-9]{4}|\[^u]|[^\"])*"(s*:)?|(true|false|null)|-?d+(?:.d*)?(?:[eE][+-]?d+)?)/g, function (match) {
                var cls = 'number';
                if (/^"/.test(match)) {
                    if (/:$/.test(match)) {
                        cls = 'key';
                    } else {
                        cls = 'string';
                    }
                } else if (/true|false/.test(match)) {
                    cls = 'boolean';
                } else if (/null/.test(match)) {
                    cls = 'null';
                }
                return '<span class="' + cls + '">' + match + '</span>';
            });
        } catch (e) {
            alert("异常信息:" + e);
        }
    
    
    }

    二、函数调用

    $("#show").html("<pre>" + prettyFormat(data) + "</pre>");

    三、html中引用

    <div id="show"></div>
  • 相关阅读:
    Vue生命周期
    事件
    改变this指向
    全屏要素
    微信小程序
    编程心得
    设计模式-单例与实例化
    第五节课 课堂总结
    作业四 分支结构
    课堂总结
  • 原文地址:https://www.cnblogs.com/youcong/p/13282716.html
Copyright © 2011-2022 走看看