zoukankan      html  css  js  c++  java
  • 【转】json格式化、高亮库jsonFormater

    http://leo108.com/pid-1996.asp

    JsonFormater

    基于jQuery的json格式化、高亮库

    核心代码参考天马行空工作室,本人只做了模块化和一些代码优化。

    demo

    http://leo108.github.io/jsonFormater/

    github地址

    https://github.com/leo108/jsonFormater

    使用方式

    引入jQuery

    1 <script type="text/javascript" src="jquery-1.7.2.min.js"></script>

    注意:jQuery版本要求>=1.7.2

    引入jsonFormater.js和jsonFormater.css

    1 <script type="text/javascript" src="jsonFormater.js"></script>
    2 <link href="jsonFormater.css" type="text/css" rel="stylesheet"/>

    在html中新增一个空的元素作为显示的容器

    例如<div id='container'></div>

    调用JsonFormater

    1 $(document).ready(function(){
    2     var options = {
    3         dom : '#container' //对应容器的css选择器
    4     };
    5     var jf = new JsonFormater(options); //创建对象
    6     jf.doFormat('{"string":"leo108"}'); //格式化json
    7 });

    效果图

    效果图

    详细使用方式

    配置

    支持的配置以及默认配置如下:

    1 {
    2     dom: '',          //用于放置的dom的选择器
    3     singleTab: "  ",  //单个tab
    4     tabSize: 2,       //缩进数量
    5     quoteKeys: true,  //key是否用双引号包含
    6     imgCollapsed: "images/Collapsed.gif"//收起的图片路径
    7     imgExpanded: "images/Expanded.gif",  //展开的图片路径
    8     isCollapsible: true //是否支持展开收起
    9 }

    方法

    1 var obj = new JsonFormater({dom: '#container'});
    2 obj.doFormat(json) //格式化一个json字符串或者js对象
    3 obj.expandAll()    //全部展开
    4 obj.collapseAll()  //全部收起
    5 obj.collapseLevel(level)  //展开到level层

  • 相关阅读:
    代码操作
    购物车
    利息计算器
    生成海报
    知识库
    JavaScript处理字符串--参照W3C
    C#输入排序-冒泡
    enum举例
    C# 表达式计算器----数据结构
    C# 测试单词的完美度
  • 原文地址:https://www.cnblogs.com/exmyth/p/6092758.html
Copyright © 2011-2022 走看看