js 格式化 json 字符串
var json = {"@odata.context":"$metadata#AddTableOne_466281s","value":[{"NAME":"李四","BIRTHDAY":"2018-10-03T11:33:50+08:00","AGE":"0","ID":"111111"}]}
JSON.stringify(json, null, "\t")
2.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>js格式化json</title>
<script>
var formatJson = function (json) {
var outStr = '', //转换后的json字符串
padIdx = 0, //换行后是否增减PADDING的标识
space = ' '; //4个空格符
if (typeof json !== 'string') {
json = JSON.stringify(json);
}
debugger
json = json.replace(/([\{\}\[\]])/g, '\r\n$1\r\n')
.replace(/(\,)/g, '$1\r\n')
.replace(/(\r\n\r\n)/g, '\r\n');
(json.split('\r\n')).forEach(function (node, index) {
var indent = 0,
padding = '';
if (node.match(/[\{\[]/)){
indent = 1;
}else if (node.match(/[\}\]]/)){
padIdx = padIdx !== 0 ? --padIdx : padIdx;
}else{
indent = 0;
}
for (var i = 0; i < padIdx; i++){
padding += space;
}
outStr += padding + node + '\r\n';
padIdx += indent;
});
return outStr;
};
//引用示例部分
//var originalJson = {'name':'ccy','age':18,'info':[{'address':'wuhan'},{'interest':'playCards'}]};
var showJson = function(){
var originalJson = document.getElementById('inputJson').value;
console.log(originalJson);
//(2)调用formatJson函数,将json格式进行格式化
var resultJson = formatJson(originalJson);
document.getElementById('out').innerHTML = resultJson;
}
</script>
</head>
<body>
<span style="position:absolute;left:0px;top:20px;font-size: 20px;font-family: '微软雅黑';color: #2F4F4F;">输入json</span>
<textarea style="position:absolute;left:0px;top:80px;width:40%;height:80%;" cols="50" rows="20" id="inputJson"></textarea>
<span style="position:absolute;left:55%;top:20px;font-size: 20px;font-family: '微软雅黑';color: #2F4F4F;">查看结果</span>
<textarea style="position:absolute;left:55%;top:80px;width:40%;height:80%;display: " id="out"></textarea>
<div style="position:absolute;left:45%;top:12%;width:6%;height:4%;">
<input type="button" value="提交" onclick="showJson();">
</div>
</body>
</html>
js 格式化 json 字符串的更多相关文章
- js格式化json字符串和json对象
1,格式化json对象 var json = {"@odata.context":"$metadata#AddTableOne_466281s","v ...
- Js格式化json字符串
var formatJson = function(json, options) { var reg = null, formatted = '', pad = 0, PADDING = ' '; / ...
- 原生js格式化json工具
json格式化小工具,原生js编写,直接上代码: <!DOCTYPE html> <html lang="en"> <head> <met ...
- js中Json字符串如何转成Json对象(4种转换方式)
js中Json字符串如何转成Json对象(4种转换方式) 一.总结 一句话总结:原生方法(就是浏览器默认支持的方法) 浏览器支持的转换方式(Firefox,chrome,opera,safari,ie ...
- js格式化JSON数据
前言: 最近做的项目中遇到个需要在前端页面中将某个设备需要的数据格式展示出来,方便用户配置.一开始单纯的将数据格式写入到pre标签中, 但是通过pre标签写入的数据格式在代码可视化上不是很优雅.由于上 ...
- js将json字符串转化成json对象的方法
js将json字符串转化成json对象的方法: JSON.parse(jsonObject)
- C#格式化JSON字符串
很多时候我们需要将json字符串以 { "status": 1, "sum": 9 }这种方式显示,而从服务端取回来的时候往往是这样 {&quo ...
- C#后台格式化JSON字符串显示
很多时候我们从服务器上获取的JSON字符串是没有格式化的,如下: {"BusinessId":null,"Code":200,"Data": ...
- 【Golang】格式化JSON字符串,方便查看
分别介绍golang及Python格式化接口返回JSON数据的方法,及Python json.dumps方法出现NameError: name 'true' is not defined原因解析及解决 ...
随机推荐
- TortoiseGit的安装
运行TortoiseGit-1.7.7.0-32bit.msi, 如下图 点击Next, 下一步 点击Next, 下一步 选择ssh客户端, 使用默认, 点击Next, 下一步 选择安装路径, 点击N ...
- java和C++之间的调用
java和C++之间的调用其实和C差不多,只是有几点不一样 区别: 包名.类名.h 这个头文件必须有且必须在JNI目录里 后缀不需要修改 /* DO NOT EDIT THIS FILE - it i ...
- 用Python在Android手机上架FTP服务器
当我们没有带数据线却将手机上的文件共享到电脑上时,架个简单的FTP服务器 可以帮我们快速解决问题.以共享手机里的照片为例: 首先将电脑.手机接入同一个wifi. 然后,手机上用QPython执行以下脚 ...
- 2019.06.05 ABAP EXCEL 操作类代码 OLE方式(模板下载,excel上传,内表下载)
一般使用标准的excel导入方法9999行,修改了标准的excel导入FM 整合出类:excel的 模板下载,excel上传,ALV内表下载功能. 在项目一开始可以SE24创建一个类来供整体开发使用, ...
- js中的堆内存和栈内存
我们常常会听说什么栈内存.堆内存,那么他们到底有什么区别呢,在js中又是如何区分他们的呢,今天我们来看一下. 一.栈内存和堆内存的区分 一般来说,栈内存主要用于存储各种基本类型的变量,包括Boolea ...
- webdriervAPI(常用的js方法)
from selenium import webdriver driver = webdriver.Chorme() driver.get("http://www.baidu.co ...
- 关于绕过cookie 同源策略,和同时向前台返回图片和脚本的解决方案
绕过cookie的同源策略 向前端写入脚本时使用domain来绕过同源策略. 比如 domain= baidu.com .次脚本生成的cookie可以在 *.baidu.com中使用 /// < ...
- python random 的用法
python random的里面的方法其实是Random实例化的对象. 里面几个常用的几个方import random print( random.randint(1,10) ) # 产生 1 到 1 ...
- 纯css实现单选框样式
html代码 <h2>你最喜欢的水果</h2> <div class="input-radio"> <!-- 选中状态添加 checked ...
- pikachu-SQL注入
参考网址: http://www.mamicode.com/info-detail-2795438.html