js实现json格式化,以及json校验工具的简单实现
JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式,采用完全独立于语言的文本格式,但是也使用了类似于C语言家族的习惯(包括C, C++, C#, Java, JavaScript, Perl, Python等)。 易于人阅读和编写,同时也易于机器解析和生成。 XML也是一种数据交换格式,为什么没有选择XML呢?因为XML虽然可以作为跨平台的数据交换格式,但是在JS中处理XML非常不方便,同时XML标记比数据多,增加了交换产生的流量,而JSON没有附加的任何标记,在JS中可作为对象处理,所以我们更倾向于选择JSON来交换数据。
一.json结构及形式
结构1:
“名称/值”对的集合(A collection of name/value pairs)。不同的语言中,它被理解为对象(object),纪录(record),结构(struct),字典(dictionary),哈希表(hash table),有键列表(keyed list),或者关联数组 (associative array)。
对应的形式为:
对象是一个无序的“‘名称/值’对”集合。一个对象以“{”(左括号)开始,“}”(右括号)结束。每个“名称”后跟一个“:”(冒号);“‘名称/值’ 对”之间使用“,”(逗号)分隔。
{ "firstName": "Brett", "lastName":"McLaughlin", "email": "aaaa" }
结构2:
值的有序列表(An ordered list of values)。在大部分语言中,它被理解为数组(array)。
对应的形式为:
数组是值(value)的有序集合。一个数组以“[”(左中括号)开始,“]”(右中括号)结束。值之间使用“,”(逗号)分隔。
[
{
key1:value1,
key2:value2
},
{
key3:value3,
key4:value4
}
]
二.json字符串转化为json对象
字符串(string)是由双引号包围的任意数量Unicode字符的集合,使用反斜线转义。一个字符(character)即一个单独的字符串(character string)。字符串(string)与C或者Java的字符串非常相似。
对应的形式:
var json_text = "{'book':{'name':'JAVA编程','author':['Liu','Xu']},'num':222}";
字符串json转化json对象有三种方式:
1.通过eval( ) 方法将字符串直接转化为JSON对象 并获得元素的值。
<script type="text/javascript">
window.onload = function(){
var json_text = "{'book':{'name':'JAVA编程','author':['Liu','Xu']},'num':222}";
//使用eval()将字符串转换为对象
var json_obj = eval("("+ json_text +")");
//访问 book-name
document.write(json_obj.book.name);
//访问 book-author-Xu
document.write(json_obj.book.author[]);
}
</script>
设计坞官网https://www.wode007.com/sites/73738.html
注意:"()"运算符
2.new Function形式
<script type="text/javascript">
window.onload = function(){
var json_text = "{'book':{'name':'JAVA编程','author':['Liu','Xu']},'num':222}";
//用new Function将字符串转换为对象
var json_obj = (new Function("return" + json_text))();
//访问 book-name
document.write(json_obj.book.name);
//访问 book-author-Xu
document.write(json_obj.book.author[]);
}
</script>
3.使用全局的JSON对象
<script type="text/javascript">
window.onload = function(){
var json_text = '{"book":"js"}';
//用全局JSON将字符串json转换为json对象
var json_obj = JSON.parse(json_text);
//访问 book-name
document.write(json_obj.book);
//访问 book-author-Xu
//document.write(json_obj.book.author[1]);
}
</script>
目前IE8(S)/Firefox3.5+/Chrome4/Safari4/Opera10 已实现了该方法。注意:'{"book":"js"}'; 里面的属性需要用双引号引起来,才能解析,否则会失败。
三.json校验格式化工具简单实现
做了一个比较简单的json格式化工具,效果如下:

代码分析:
<body>
<textarea id="content_value">
</textarea>
<input type="button" value="格式化" onclick="check()">
<textarea id="output_value">
</textarea>
</body>
<script type="text/javascript">
function check(){
var text_value = document.getElementById('content_value').value;
if(text_value == ""){
alert("不能为空");
return false;
} else {
var res="";
for(var i=,j=,k=,ii,ele;i<text_value.length;i++)
{//k:缩进,j:""个数
ele=text_value.charAt(i);
if(j%==&&ele=="}")
{
k--;
for(ii=;ii<k;ii++) ele=" "+ele;
ele="\n"+ele;
}
else if(j%==&&ele=="{")
{
ele+="\n";
k++;
debugger;
for(ii=;ii<k;ii++) ele+=" ";
}
else if(j%==&&ele==",")
{
ele+="\n";
for(ii=;ii<k;ii++) ele+=" ";
}
else if(ele=="\"") j++;
res+=ele;
}
document.getElementById('output_value').value = res;
}
}
</script>
js实现json格式化,以及json校验工具的简单实现的更多相关文章
- 给json格式化的一个小工具
var glob = require("glob") // options is optional var fs=require("fs") glob(&quo ...
- JSON格式化与serialize序列化
一.JSON格式化 1. JSON是什么 JSON是一种数据的存储格式,用来沟通客户端Javascript和服务端PHP的交互.我们把用PHP生成JSON后的字符串传给前台Javascript,Jav ...
- ABP入门系列(8)——Json格式化
ABP入门系列目录--学习Abp框架之实操演练 讲完了分页功能,这一节我们先不急着实现新的功能.来简要介绍下Abp中Json的用法.为什么要在这一节讲呢?当然是做铺垫啊,后面的系列文章会经常和Json ...
- 【转】json格式化、高亮库jsonFormater
http://leo108.com/pid-1996.asp JsonFormater 基于jQuery的json格式化.高亮库 核心代码参考天马行空工作室,本人只做了模块化和一些代码优化. demo ...
- JSON在线解析及格式化校验工具 jsonin.com
JSON在线解析及格式化校验工具 JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式.它使得人们很容易的进行阅读和编写.同时也方便了机器进行解析和生成.它是基 ...
- 校验字符串是否是JSON格式,将不规则展示的json格式的字符串进行规则展示(json格式化)
版权声明:本文为博主原创文章,未经博主允许不得转载. 目录(?)[+] var str = {"code": "","svcname" ...
- asp.net中json格式化及在js中解析json
类: public class UploadDocumentItem { public UploadDocumentItem() { } public string DocMuid { get; se ...
- json格式化和查看工具
以前一直以来都觉得xml个可读性要比json的可读性好,后来使用了JSON Viewer这个小工具之后,发现自己错了.之前认为json的可读性差,完全是因为没有很好的查看工具.JSON Viewer这 ...
- json格式化显示样式js代码分享
最近开发中需要在页面展示json.特整理了下代码,送给大家,希望能帮到有同样需求的朋友们. 代码: <html> <script src="http://cdn.bootc ...
随机推荐
- Java实现预排序
1 问题描述 在计算机科学中,预排序是一种很古老的思想.实际上,对于排序算法的兴趣很大程度上是因为这样一个事实:如果列表是有序的,许多关于列表的问题更容易求解.显然,对于包含了排序操作,这种算法的时间 ...
- 记一次discuz修改首页图片路径问题
1.找到图片路径拼装文件 首先打开根目录下的template目录找到首页文件 打开后找到图片列表的拼装位置 // 链接示例: <!--{eval $imagelistkey = getforum ...
- JavaScript使用for循环和splice删除数组指定元素的注意点
在JavaScript里可以结合for循环和splice来删除数组指定的元素.但是要注意删除元素后,数组索引会发生改变 示例 var arr = ["a","b" ...
- 05-IntentFilter的匹配规则
IntentFilter的匹配规则 原则上一个Intent不应该既是显示调用又是隐式调用,如果二者共存的话以显式调用为主 隐式调用需要Intent能够匹配目标组件的IntentFilter中所设置的过 ...
- ZooKeeper搭建集群
ZooKeeper ZooKeeper是一个分布式的,开放源码的分布式应用程序协调服务,是Google的Chubby一个开源的实现,是Hadoop和Hbase的重要组件.它是一个为分布式应用提供一致性 ...
- ASP.NET Core 3.1 WebApi部署到腾讯云CentOS 7+Docker
一.准备 首先需要有一台CentOS服务器,安装最新版Docker,配置镜像加速等,安装方法网上很多,下面是一些相关指令: yum install -y yum-utils device-mapper ...
- CSS中的百分比(%)如何使用???
除了height以外垂直方向上的margin-top(bottom)或者padding-top(bottom)的百分比取值都是相对于父元素的宽度 在默认的content-box盒模型下元素的width ...
- Yii2.0ActiveRecord嵌套子查询(AR子查询)
yii2.0的ActiveRecord是可以嵌套子查询的. 比如从一个子查询里面筛选数据. 首先实例化出来一个Query对象,代表子查询. $subQuery = new \yii\db\Query( ...
- LR脚本信息函数-lr_get_host_name
lr_get_host_name() 返回主机的名称. char * lr_get_host_name(); lr_get_host_name函数返回执行脚本的机器的名称. 示例:lr_get_hos ...
- 这一次搞懂Spring的XML解析原理
前言 Spring已经是我们Java Web开发必不可少的一个框架,其大大简化了我们的开发,提高了开发者的效率.同时,其源码对于开发者来说也是宝藏,从中我们可以学习到非常优秀的设计思想以及优雅的命名规 ...