JSON解析格式化工具——非插件（超好用推荐）

最新推荐文章于 2024-08-19 10:50:12 发布

zoeezym

最新推荐文章于 2024-08-19 10:50:12 发布

阅读量4.3k

点赞数 4

分类专栏：每日积累文章标签： json javascript

本文链接：https://blog.csdn.net/qq_44116263/article/details/106855226

版权

每日积累专栏收录该内容

10 篇文章 0 订阅

订阅专栏

原因：云桌面上外网连不上，不能用在线json解析，就想找个程序工具或者Chrome插件。

以为就一个小插件一小会就能弄好，结果找了好几个网址用了快有一小时才找到满意的，chrome搬运的下载资源都试了不能用，或者jsonformatter插件是要发送接口请求才能返回json，但是我想把已有的json格式化，最好是独立工具。功不唐捐终于找到了

JsonView：

非插件的json转换工具，有个很好用的功能是，它不仅能格式化json，还能展示json结构图，有些复杂的json只看格式很容易混乱，肉眼是分不太清具体结构的，这个就很清晰

下载地址：https://pan.baidu.com/s/1pLJumGb

CR. JSON格式化工具化下载

里面还有几种JSON工具有空都试试。

拓展：

JSON: JavaScript Object Notation(JavaScript 对象表示法)

JSON 是存储和交换文本信息的语法。类似 XML。

JSON 比 XML 更小、更快，更易解析。目前非常多的动态（PHP，JSP，.NET）编程语言都支持JSON。

与 XML 相同之处

JSON 是纯文本
JSON 具有"自我描述性"（人类可读）
JSON 具有层级结构（值中存在值）
JSON 可通过 JavaScript 进行解析
JSON 数据可使用 AJAX 进行传输

与 XML 不同之处

没有结束标签
更短
读写的速度更快
能够使用内建的 JavaScript eval() 方法进行解析
使用数组
不使用保留字

JSON 值

JSON 值可以是：

数字（整数或浮点数）
字符串（在双引号中）
逻辑值（true 或 false）
数组（在中括号中）
对象（在大括号中）
null

JSON 数字

JSON 数字可以是整型或者浮点型

JSON 对象在大括号（{}）中书写

{
"sites": [
{ "name":"John" , "addr":"武汉" }, 
{ "name":"Golden" , "addr":null }, 
{ "name":"Aurora" , "addr":"曼谷" }
]
}
//可以设置null值

通过 JavaScript创建一个对象数组并赋值：

var sites = [
    { "name":"John" , "addr":"武汉" }, 
    { "name":"Golden" , "addr":null }, 
    { "name":"Aurora" , "addr":"曼谷" }
];

取值赋值：

//取值
sites[0].name;
//赋值
sites[0].name="Kate";

JSON和字符串间转换方法：

通常用于与服务端交换数据，在接收服务器数据时一般是字符串，使用 JSON.parse() 方法将数据转换为 JavaScript 对象；在向服务器发送数据时一般是字符串，使用 JSON.stringify() 方法将 JavaScript 对象转换为字符串：

JSON.parse(text[, reviver])
JSON.stringify(value[, replacer[, space]])

JSONP

Jsonp(JSON with Padding) 是 json 的一种"使用模式"，可以让网页从别的域名（网站）那获取资料，即跨域读取数据。

为什么我们从不同的域（网站）访问数据需要一个特殊的技术( JSONP )呢？这是因为同源策略。

同源策略，它是由 Netscape 提出的一个著名的安全策略，现在所有支持 JavaScript 的浏览器都会使用这个策略。

如客户想访问 : https://www.runoob.com/try/ajax/jsonp.php?jsoncallback=callbackFunction。

假设客户期望返回数据：["customername1","customername2"]。

真正返回到客户端的数据显示为: callbackFunction(["customername1","customername2"])。

JQuery实现：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>JSONP 实例</title>
    <script src="https://cdn.static.runoob.com/libs/jquery/1.8.3/jquery.js"></script>    
</head>
<body>
<div id="divCustomers"></div>
<script>
$.getJSON("https://www.runoob.com/try/ajax/jsonp.php?jsoncallback=?", function(data) {
    
    var html = '<ul>';
    for(var i = 0; i < data.length; i++)
    {
        html += '<li>' + data[i] + '</li>';
    }
    html += '</ul>';
    
    $('#divCustomers').html(html); 
});
</script>
</body>
</html>

有一篇JSONP讲解很易懂，收藏有空细读并写自己的理解：

jsonp原理详解——终于搞清楚jsonp是啥了