基于jquery+html開(kāi)發(fā)的json格式校驗(yàn)工具
json簡(jiǎn)介
JSON是一種輕量級(jí)的數(shù)據(jù)交換格式。 易于人閱讀和編寫(xiě)。同時(shí)也易于機(jī)器解析和生成。 它基于JavaScript Programming Language, Standard ECMA-262 3rd Edition - December 1999的一個(gè)子集。 JSON采用完全獨(dú)立于語(yǔ)言的文本格式,但是也使用了類(lèi)似于C語(yǔ)言家族的習(xí)慣(包括C, C++, C#, Java, JavaScript, Perl, Python等)。 這些特性使JSON成為理想的數(shù)據(jù)交換語(yǔ)言。
json在線(xiàn)解析及格式化工具介紹
JSON格式化和JSON驗(yàn)證器工具幫助自動(dòng)格式化JSON和驗(yàn)證您的JSON文本。它還提供了一個(gè)樹(shù)視圖,幫助導(dǎo)航格式化的JSON數(shù)據(jù)。
體驗(yàn)地址是:fktool.com/json/
源碼分享
xml
復(fù)制代碼
html
>
<
html
lang
=
"zh-CN"
>
<
head
>
<
title
>
JSON在線(xiàn)解析 | JSON在線(xiàn)格式化校驗(yàn)工具
title
>
<
meta
charset
=
"utf-8"
/>
<
meta
name
=
"viewport"
content
=
"width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=5.0, user-scalable=yes"
/>
<
meta
name
=
"applicable-device"
content
=
"pc,mobile"
/>
<
meta
name
=
"keywords"
content
=
"json格式化, json在線(xiàn)解析, json校驗(yàn)"
/>
<
meta
name
=
"description"
content
=
"一個(gè)功能強(qiáng)大的在線(xiàn) JSON 解析和格式化工具,提供JSON在線(xiàn),json解析,json在線(xiàn)解析,JSON Formatter,json數(shù)組,JSON校驗(yàn),格式化JSON,xml轉(zhuǎn)json工具,在線(xiàn)json格式化工具,json格式化,json格式化工具,json字符串格式化,json在線(xiàn),json在線(xiàn)驗(yàn)證,json在線(xiàn)校驗(yàn)"
/>
<
meta
itemprop
=
"name"
content
=
"json在線(xiàn)解析工具"
/>
<
meta
itemprop
=
"description"
content
=
"一個(gè)功能強(qiáng)大的在線(xiàn) JSON 解析和格式化工具..."
/>
<
meta
name
=
"twitter:card"
content
=
"summary_large_image"
/>
<
meta
name
=
"twitter:title"
content
=
"json在線(xiàn)解析工具"
/>
<
meta
name
=
"twitter:description"
content
=
"一個(gè)功能強(qiáng)大的在線(xiàn) JSON 解析和格式化工具..."
/>
<
meta
name
=
"renderer"
content
=
"webkit"
/>
<
meta
name
=
"apple-mobile-web-app-capable"
content
=
"yes"
/>
<
link
rel
=
"icon"
type
=
"image/png"
href
=
"/images/favicon_48x48.png"
>
<
link
rel
=
"apple-touch-icon"
sizes
=
"114x114"
href
=
"/images/favicon_114x114.png"
>
<
link
rel
=
"icon"
href
=
"/images/favicon.ico"
type
=
"image/x-icon"
/>
<
link
href
=
"https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css"
rel
=
"stylesheet"
type
=
"text/css"
/>
<
link
href
=
"./static/style/tool.css"
rel
=
"stylesheet"
type
=
"text/css"
/>
head
>
<
body
>
<
header
class
=
"hd-nav"
>
<
a
class
=
"navbar-icon"
href
=
"/"
>
<
img
src
=
"/images/icon_36x36.svg"
width
=
"32"
height
=
"32"
alt
=
"fktool在線(xiàn)工具網(wǎng)"
/>
<
span
class
=
"navbar-label"
>
FKTool.com
span
>
a
>
header
>
<
div
class
=
"main"
>
<
div
class
=
"left"
>
<
div
class
=
"row"
>
<
h1
style
=
"font-size: 24px;margin: 16px 16px;color:#7952b3;"
>
JSON在線(xiàn)格式化工具
h1
>
div
>
<
div
class
=
"row"
>
<
div
class
=
"banner"
>
輸入要解析的json文本并點(diǎn)擊格式化按鈕
div
>
div
>
<
div
class
=
"row"
>
<
div
class
=
"col-md-12 col10main"
>
<
div
class
=
"accordion"
id
=
"accordion2"
>
<
div
class
=
"accordion-group"
>
<
div
class
=
"panel panel-defaul"
>
<
form
id
=
"form1"
class
=
"form-horizontal"
method
=
"post"
>
<
div
class
=
"input-group mb5"
><
input
class
=
"form-control"
type
=
"text"
id
=
"txt_url"
placeholder
=
"輸入遠(yuǎn)程Json網(wǎng)址"
/>
<
span
class
=
"input-group-btn"
><
button
class
=
"btn btn-default"
type
=
"button"
id
=
"get_remote"
>遠(yuǎn)程獲取Json
button
>
span
>
div
>
<
div
class
=
"form-group"
>
<
div
class
=
"col-sm-12"
><
textarea
id
=
"content"
name
=
"content"
class
=
"form-control"
rows
=
"14"
placeholder
=
"請(qǐng)輸入Json,Json格式化的時(shí)候要去除所有轉(zhuǎn)義,轉(zhuǎn)義存在可能導(dǎo)致Json校驗(yàn)不通過(guò)"
>
textarea
>
div
>
div
>
<
div
class
=
"form-group"
>
<
div
class
=
"col-sm-12 text-center"
>
<
input
type
=
"button"
class
=
"btn btn-success"
name
=
"validate"
id
=
"validate"
value
=
"Json格式化"
/>
<
input
type
=
"button"
class
=
"btn btn-info"
onclick
=
"jsonzip(1);"
value
=
"Json壓縮"
>
<
span
id
=
"copyallcode"
class
=
"btn btn-default"
data-clipboard-target
=
"#content"
>復(fù)制
span
>
<
input
type
=
"button"
class
=
"btn btn-default"
onclick
=
"content.value=''"
value
=
"清空"
>
div
>
div
>
<
div
class
=
"form-group"
>
<
div
class
=
"col-sm-12"
>
<
div
class
=
"alert alert-warning alert-dismissible text-left"
role
=
"alert"
id
=
"results"
>
<
span
>
請(qǐng)輸入需要格式化的Json字符串
span
>
div
>
div
>
div
>
form
>
div
>
div
>
<
div
class
=
"alert alert-info main-desc"
>
<
h2
class
=
"f20"
>
json在線(xiàn)解析及格式化工具介紹
h2
>
<
p
>
JSON格式化和JSON驗(yàn)證器工具幫助自動(dòng)格式化JSON和驗(yàn)證您的JSON文本。它還提供了一個(gè)樹(shù)視圖,幫助導(dǎo)航格式化的JSON數(shù)據(jù)。它具有如下優(yōu)點(diǎn):
p
>
<
ul
>
<
li
>
它有助于通過(guò)錯(cuò)誤消息在線(xiàn)驗(yàn)證JSON。
li
>
<
li
>
它是唯一的JSON工具,顯示圖像懸停在樹(shù)視圖中的圖像URL。
li
>
<
li
>
它也是一個(gè)JSON美化器,支持縮進(jìn)級(jí)別:2個(gè)空格,3個(gè)空格和4個(gè)空格。
li
>
<
li
>
支持打印JSON數(shù)據(jù)。
li
>
<
li
>
JSON文件格式化器提供了上傳JSON文件和下載格式化JSON文件的功能。這個(gè)功能有助于格式化json文件。
li
>
<
li
>
95%的API使用JSON在客戶(hù)端和服務(wù)器之間傳輸數(shù)據(jù)。這個(gè)工具可以作為API格式化器使用。
li
>
<
li
>
支持JSON字符串的JSON圖形視圖,作為JSON調(diào)試器或糾錯(cuò)器,可以格式化數(shù)組和對(duì)象。
li
>
<
li
>
在瀏覽器的本地存儲(chǔ)中存儲(chǔ)最后一個(gè)JSON格式的數(shù)據(jù)。這可以用作notepad++ / Sublime / VSCode JSON美化的替代方案。
li
>
<
li
>
這個(gè)JSON在線(xiàn)格式化器也可以作為JSON Lint工作。
li
>
<
li
>
使用自動(dòng)開(kāi)關(guān)打開(kāi)或關(guān)閉自動(dòng)更新進(jìn)行美化。
li
>
<
li
>
它使用$。parseJSON和JSON。stringify美化JSON,以便于人類(lèi)閱讀和分析。
li
>
<
li
>
下載JSON,一旦它被創(chuàng)建或修改,它可以在notepad++, Sublime,或VSCode替代打開(kāi)。
li
>
<
li
>
JSON格式檢查器有助于修復(fù)缺失的引號(hào),點(diǎn)擊設(shè)置圖標(biāo),看起來(lái)像一個(gè)螺絲刀在編輯器的左邊來(lái)修復(fù)格式。
li
>
ul
>
<
h2
>
JSON簡(jiǎn)介
h2
>
<
p
>
JSON是一種輕量級(jí)的數(shù)據(jù)交換格式。 易于人閱讀和編寫(xiě)。同時(shí)也易于機(jī)器解析和生成。 它基于JavaScript Programming Language, Standard
ECMA-262 3rd Edition - December 1999的一個(gè)子集。 JSON采用完全獨(dú)立于語(yǔ)言的文本格式,但是也使用了類(lèi)似于C語(yǔ)言家族的習(xí)慣(包括C,
C++, C#, Java, JavaScript, Perl, Python等)。 這些特性使JSON成為理想的數(shù)據(jù)交換語(yǔ)言。
p
>
<
h2
>
與其他格式的比較
h2
>
<
h3
>
XML
h3
>
<
p
>
JSON與XML最大的不同在于XML是一個(gè)完整的標(biāo)記語(yǔ)言,而JSON不是。這使得XML在程序判讀上需要比較多的功夫。主要的原因在于XML的設(shè)計(jì)理念與JSON不同。XML利用標(biāo)記語(yǔ)言的特性提供了絕佳的延展性(如XPath),在數(shù)據(jù)存儲(chǔ),擴(kuò)展及高級(jí)檢索方面具備對(duì)JSON的優(yōu)勢(shì),而JSON則由于比XML更加小巧,以及瀏覽器的內(nèi)置快速解析支持,使得其更適用于網(wǎng)絡(luò)數(shù)據(jù)傳輸領(lǐng)域。
p
>
<
h3
>
YAML
h3
>
<
p
>
在功能和語(yǔ)法上,JSON 都是 YAML 語(yǔ)言的一個(gè)子集。特別是,YAML
1.2規(guī)范指定“任何JSON格式的文件都是YAML格式的有效文件"。最常見(jiàn)的YAML解析器也能夠處理JSON。版本 1.2 之前的 YAML 規(guī)范沒(méi)有完全涵蓋
JSON,主要是由于 YAML 中缺乏本機(jī) UTF-32 支持,以及對(duì)逗號(hào)分隔空格的要求;此外,JSON 規(guī)范還包括 /* */ 樣式的注釋。YAML
最重要的區(qū)別是語(yǔ)法擴(kuò)展集,它們?cè)?JSON 中沒(méi)有類(lèi)似物:關(guān)系數(shù)據(jù)支持:在 YAML
文檔中,可以引用以前在文件/流中找到的錨點(diǎn);通過(guò)這種方式,您可以表達(dá)遞歸結(jié)構(gòu)。支持除基元之外的可擴(kuò)展數(shù)據(jù)類(lèi)型,如字符串、數(shù)字、布爾值等。支持帶縮進(jìn)的塊語(yǔ)法;它允許您在不使用不必要的符號(hào)的情況下描述結(jié)構(gòu)化數(shù)據(jù):各種括號(hào)、引號(hào)等。
p
>
<
h3
>
MessagePack
h3
>
<
p
>
MessagePack比JSON更短小,快速。
p
>
<
h3
>
格式化工具
h3
>
<
p
>
JSON格式取代了XML給網(wǎng)絡(luò)傳輸帶來(lái)了很大的便利,但是卻沒(méi)有了XML的一目了然,尤其是JSON數(shù)據(jù)很長(zhǎng)的時(shí)候,會(huì)讓人陷入繁瑣復(fù)雜的數(shù)據(jù)節(jié)點(diǎn)查找中。開(kāi)發(fā)者可以通過(guò)在線(xiàn)JSON格式化工具,來(lái)更方便的對(duì)JSON數(shù)據(jù)進(jìn)行節(jié)點(diǎn)查找和解析。
p
>
<
h2
>
參考資料:
h2
>
<
ul
>
<
li
>
<
a
href
=
"https://zh.wikipedia.org/wiki/JSON"
>
https://zh.wikipedia.org/wiki/JSON
a
>
li
>
<
li
>
<
a
href
=
"https://zhuanlan.zhihu.com/p/33792109"
>https://zhuanlan.zhihu.com/p/33792109
a
>
li
>
<
li
>
<
a
href
=
"https://www.json.org/json-zh.html"
>
https://www.json.org/json-zh.html
a
>
li
>
<
li
>
<
a
href
=
"https://developer.mozilla.org/zh-CN/docs/Learn/JavaScript/Objects/JSON"
>
https://developer.mozilla.org/zh-CN/docs/Learn/JavaScript/Objects/JSON
a
>
li
>
ul
>
div
>
<
div
class
=
"accordion-group"
>
div
>
div
>
div
>
div
>
div
>
<
div
class
=
"right"
>
<
div
class
=
"search"
>
<
input
id
=
"keyword"
/>
<
div
class
=
"search-btn"
>
搜索
div
>
div
>
<
div
class
=
"recommend"
>
<
div
class
=
"recommend-head"
>
相關(guān)推薦
div
>
<
div
class
=
"recommend-list"
>
<
a
class
=
"recommend-list-item"
href
=
"https://ps.gitapp.cn"
>
在線(xiàn)ps
a
>
<
a
class
=
"recommend-list-item"
href
=
"https://fangdai.gitapp.cn"
>
房貸計(jì)算器
a
>
<
a
class
=
"recommend-list-item"
href
=
"https://ps.fktool.com"
>
Online PS
a
>
<
a
class
=
"recommend-list-item"
href
=
"https://base64.fktool.com"
>
base64解碼
a
>
div
>
div
>
div
>
div
>
<
script
src
=
"./static/script/jquery-1.11.3.min.js"
type
=
"text/javascript"
>
script
>
<
script
src
=
"./static/script/bootstrap.min.js"
type
=
"text/javascript"
>
script
>
<
script
src
=
"./static/script/tool.js"
type
=
"text/javascript"
>
script
>
<
script
src
=
"./static/script/json/jsonformat.js"
type
=
"text/javascript"
>
script
>
<
script
type
=
"text/javascript"
>
setJS
([
"./static/script/json/jsonzip.js"
]);
script
>
div
>
<
div
class
=
"copyright"
id
=
"footer"
>
<
div
class
=
"container"
>
<
div
class
=
"row"
>
<
div
class
=
"col-sm-12"
>
<
span
>
Copyright ?2023
<
a
href
=
"/"
>
fktool在線(xiàn)工具網(wǎng)
a
>
span
>
|
<
span
>
span
>
div
>
div
>
div
>
div
>
<
script
>
script
>
body
>
html
>
與其他格式比較
XML JSON與XML最大的不同在于XML是一個(gè)完整的標(biāo)記語(yǔ)言,而JSON不是。這使得XML在程序判讀上需要比較多的功夫。主要的原因在于XML的設(shè)計(jì)理念與JSON不同。XML利用標(biāo)記語(yǔ)言的特性提供了絕佳的延展性(如XPath),在數(shù)據(jù)存儲(chǔ),擴(kuò)展及高級(jí)檢索方面具備對(duì)JSON的優(yōu)勢(shì),而JSON則由于比XML更加小巧,以及瀏覽器的內(nèi)置快速解析支持,使得其更適用于網(wǎng)絡(luò)數(shù)據(jù)傳輸領(lǐng)域。
YAML 在功能和語(yǔ)法上,JSON 都是 YAML 語(yǔ)言的一個(gè)子集。特別是,YAML 1.2規(guī)范指定“任何JSON格式的文件都是YAML格式的有效文件"。最常見(jiàn)的YAML解析器也能夠處理JSON。版本 1.2 之前的 YAML 規(guī)范沒(méi)有完全涵蓋 JSON,主要是由于 YAML 中缺乏本機(jī) UTF-32 支持,以及對(duì)逗號(hào)分隔空格的要求;此外,JSON 規(guī)范還包括 /* */ 樣式的注釋。YAML 最重要的區(qū)別是語(yǔ)法擴(kuò)展集,它們?cè)?JSON 中沒(méi)有類(lèi)似物:關(guān)系數(shù)據(jù)支持:在 YAML 文檔中,可以引用以前在文件/流中找到的錨點(diǎn);通過(guò)這種方式,您可以表達(dá)遞歸結(jié)構(gòu)。支持除基元之外的可擴(kuò)展數(shù)據(jù)類(lèi)型,如字符串、數(shù)字、布爾值等。支持帶縮進(jìn)的塊語(yǔ)法;它允許您在不使用不必要的符號(hào)的情況下描述結(jié)構(gòu)化數(shù)據(jù):各種括號(hào)、引號(hào)等。
MessagePack MessagePack比JSON更短小,快速。
總結(jié)
JSON格式取代了XML給網(wǎng)絡(luò)傳輸帶來(lái)了很大的便利,但是卻沒(méi)有了XML的一目了然,尤其是JSON數(shù)據(jù)很長(zhǎng)的時(shí)候,會(huì)讓人陷入繁瑣復(fù)雜的數(shù)據(jù)節(jié)點(diǎn)查找中。開(kāi)發(fā)者可以通過(guò)在線(xiàn)JSON格式化工具,來(lái)更方便的對(duì)JSON數(shù)據(jù)進(jìn)行節(jié)點(diǎn)查找和解析。