javascript格式化json显示实例分析

本文实例讲述了javascript格式化json显示方法。分享给大家供大家参考。具体分析如下：

将json对象或者json字符串格式化方便在网页上限制

var formatJson = function(json, options) {
 var reg = null,
 formatted = '',
 pad = 0,
 PADDING = '';
 //one can also use '\t' or a different number of spaces
 // optional settings
 options = options || {};
 // remove newline where '{' or '[' follows ':'
 options.newlineAfterColonIfBeforeBraceOrBracket = (options.newlineAfterColonIfBeforeBraceOrBracket === true) ? true : false;
 // use a space after a colon
 options.spaceAfterColon = (options.spaceAfterColon === false) ? false : true;
 // begin formatting...
 if (typeof json !== 'string') {
 // make sure we start with the JSON as a string
 json = JSON.stringify(json);
 } else {
 // is already a string, so parse and re-stringify
 //in order to remove extra whitespace
 json = JSON.parse(json);
 json = JSON.stringify(json);
 }
 // add newline before and after curly braces
 reg = /([\{\}])/g;
 json = json.replace(reg, '\r\n$1\r\n');
 // add newline before and after square brackets
 reg = /([\[\]])/g;
 json = json.replace(reg, '\r\n$1\r\n');
 // add newline after comma
 reg = /(\,)/g;
 json = json.replace(reg, '$1\r\n');
 // remove multiple newlines
 reg = /(\r\n\r\n)/g;
 json = json.replace(reg, '\r\n');
 // remove newlines before commas
 reg = /\r\n\,/g;
 json = json.replace(reg, ',');
 // optional formatting...
 if (!options.newlineAfterColonIfBeforeBraceOrBracket) {
 reg = /\:\r\n\{/g;
 json = json.replace(reg, ':{');
 reg = /\:\r\n\[/g;
 json = json.replace(reg, ':[');
 }
 if (options.spaceAfterColon) {
 reg = /\:/g;
 json = json.replace(reg, ': ');
 }
 $.each(json.split('\r\n'), function(index, node) {
 var i = 0,
  indent = 0,
  padding = '';
 if (node.match(/\{$/) || node.match(/\[$/)) {
  indent = 1;
 } else if (node.match(/\}/) || node.match(/\]/)) {
  if (pad !== 0) {
  pad -= 1;
  }
 } else {
  indent = 0;
 }
 for (i = 0; i < pad; i++) {
  padding += PADDING;
 }
 formatted += padding + node + '\r\n';
 pad += indent;
 });
 return formatted;
};

关于json格式化感兴趣的朋友还可参考在线工具：

JSON代码工具

希望本文所述对大家的javascript程序设计有所帮助。

赞 (0)

相关推荐

  • JS处理json日期格式化问题

    起因 对于从C#返回的日期字段,当进行JSON序列化后,在前台JS里显示的并不是真正的日期,这让我们感觉很不爽,我们不可能为了这东西,把所有日期字段都变成string吧,所以,找了一个JS的扩展方法,来实现这个功能 实现 function ChangeDateFormat(jsondate) { jsondate = jsondate.replace("/Date(", "").replace(")/", ""); if (j

  • JSON辅助格式化处理方法

    JSON辅助格式化处理方法

    平时服务器端开发人员写好后台之后一般写一份简单的接口说明页面,类似: 复制代码 代码如下: <form action="test.php" accept-charset="utf-8"> <div><label for="">param_1</label><input type="text" name="param_1" value="valu

  • python自动格式化json文件的方法

    本文实例讲述了python自动格式化json文件的方法.分享给大家供大家参考.具体如下: 这里主要实现将代码混乱的json文件格式化. 还有一小堆python常用算法代码 完整实例代码点击此处本站下载. class JsonFormatter: def __init__(self,intend=4,name=""): self.name=name self.intend=intend self.stack=[] self.obj=None self.source=self.get_so

  • json格式化/压缩工具 Chrome插件扩展版

    安装方法:用chrome浏览器访问 https://chrome.google.com/extensions/detail/pjkoglpbigbjijmncfkcpkcpddnelgbm?hl=zh-cn [json格式化/压缩]工具 chrome下安装 :) 1.建一个新的文件夹 2.建一个名为 manifest.json的文件 3.打开这个 manifest.json文件,可以理解为配置文件 :) 包含以下内容 复制代码 代码如下: { "name": "My Firs

  • asp.net中各种类型的JSON格式化

    复制代码 代码如下: using System; using System.Collections.Generic; using System.Text; using System.Data; using System.Reflection; using System.Collections; using System.Data.Common; public class ConvertJson { #region 私有方法 /// <summary> /// 过滤特殊字符 /// </s

  • 使用正则表达式的格式化与高亮显示json字符串

    json字符串很有用,有时候一些后台接口返回的信息是字符串格式的,可读性很差,这个时候要是有个可以格式化并高亮显示json串的方法那就好多了,下面看看一个正则表达式完成的json字符串的格式化与高亮显示 首先是对输入进行转换,如果是对象则转化为规范的json字符串,不是对象时,先将字符串转化为对象(防止不规范的字符串),然后再次转化为json串.其中json为输入. 复制代码 代码如下: if (typeof json !== 'string') {     json = JSON.string

  • JSON格式化输出

    今天有个需求是对输出的JSON进行格式化 首先想到的就是jsBeautifier之类的小插件 搜索了一番看到有一位朋友回答JSON.stringify可以输出格式化的JSON字符串 复制代码 代码如下: JSON.stringify(jsObj, null, "\t"); // 缩进一个tab JSON.stringify(jsObj, null, 4);    // 缩进4个空格 唔,不错 PS:关于json操作,这里再为大家推荐几款比较实用的json在线工具供大家参考使用: 在线J

  • javascript格式化json显示实例分析

    本文实例讲述了javascript格式化json显示方法.分享给大家供大家参考.具体分析如下: 将json对象或者json字符串格式化方便在网页上限制 var formatJson = function(json, options) { var reg = null, formatted = '', pad = 0, PADDING = ''; //one can also use '\t' or a different number of spaces // optional settings

  • JavaScript常见JSON操作实例分析

    本文实例讲述了JavaScript常见JSON操作.分享给大家供大家参考,具体如下: 1.JSON JSON,JavaScript Object Notation)(JavaScript对象表示法) ,是存储和交换文本信息的语法,是基于JavaScript的一个子集.数据格式简单,易于读写,占用带宽小,类似 XML,但JSON 比 XML更小.更快,更易解析. JSON不支持变量.函数.对象实例,只是一种数据的格式.数据在键值对中,数据由逗号分隔. 2.JSON数据类型 (1)简单数据类型:字符

  • JavaScript格式化json和xml的方法示例

    本文实例讲述了JavaScript格式化json和xml的方法.分享给大家供大家参考,具体如下: 格式化json实例 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>原生js格式化json的方法</title> </head> <body> <!--格式化后的json写入的位

  • jQuery解析json数据实例分析

    jQuery解析json数据实例分析

    本文实例分析了jQuery解析json数据的方法.分享给大家供大家参考,具体如下: 先来看看我们的Json数据格式: [ {id:01,name:"小白",old:29,sex:"男"}, {id:02,name:"小蓝",old:29,sex:"男"}, {id:03,name:"小雅",old:29,sex:"男"} ] 为了消除乱码问题,我们设置一个过滤器(代码片段) public

  • PHP针对JSON操作实例分析

    本文实例分析了PHP针对JSON操作.分享给大家供大家参考.具体分析如下: 由于JSON可以在很多种程序语言中使用,所以我们可以用来做小型数据中转,如:PHP输出JSON字符串供JavaScript使用等.在PHP中可以使用 json_decode() 由一串规范的字符串解析出 JSON对象,使用 json_encode() 由JSON 对象生成一串规范的字符串. 例: 复制代码 代码如下: <?php $json = '{"a":1, "b":2, &quo

  • Javascript访问器属性实例分析

    本文实例分析了Javascript 访问器属性的用法,分享给大家供大家参考.具体分析如下: 这个和构造函数的意思有点像,但功能又不同,他可以让两个属性建立关联,通过修改一个属性来改变另一个属性. 复制代码 代码如下: var book = {     _year:2004,     edition: 1 }; Object.defineProperty(book, "year", {     get: function() {         return this._year;   

  • JavaScript事件委托技术实例分析

    本文实例分析了JavaScript事件委托技术.分享给大家供大家参考.具体分析如下: 如果一个整体页面里有大量的按钮.我们就要为每一个按钮绑定事件处理程序.这样就会影响性能了. 首先每个函数都是对象,对象就会占用很多内存.内存中的对象越多,性能就越差. 其次,dom访问次数增多,就会导致延迟加载页面.事实上,从如何来利用好事件处理程序,还是有很好的解决方案的. 事件委托: 对事件处理程序过多的问题解决的方案就是事件委托技术. 事件委托技术利用了事件冒泡.只需指定一个事件处理程序. 我们可以为某个

  • JavaScript中继承用法实例分析

    本文实例分析了JavaScript中继承的用法.分享给大家供大家参考.具体如下: // define the Person Class function Person() {} Person.prototype.walk = function(){ alert ('I am walking!'); }; Person.prototype.sayHello = function(){ alert ('hello'); }; // define the Student class function

  • jquery处理json数据实例分析

    一.JSON的一些基础知识. JSON中对象通过"{}"来标识,一个"{}"代表一个对象,如{"AreaId":"123"},对象的值是键值对的形式(key:value). "[]",标识数组,数组内部各个数据之间通过","分割,如["AreaId":"123","AreaId":"345"]. 很多情况下是

  • JavaScript 事件冒泡应用实例分析

    JavaScript 事件冒泡应用实例分析

    然而,在今天一些大型的WEB交互项目中,比如大型的WebGame项目,JavaScript事件冒泡影响是值得重视的.本文通过一个简单的例子来讲解JavaScript事件冒泡及使用注意事项. 如果你对JavaScript事件冒泡还没有什么印象,不妨先看看我之前写的一篇博客<JavaScript事件冒泡简介及应用>.本文讲究实用,不在对JavaScript事件冒泡基础知识进行过多的阐述. 在文章开始之前,现在先看看下面这样一个需求:下面HTML假设描述的是一个WebGame项目包裹栏(玩过网游的人

随机推荐