html格式化json的实例代码
这篇文章主要介绍了html格式化json的实例代码,需要的朋友可以参考下
废话不多说了，直接给大家贴代码了，具体代码如下所示：
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8>
<title>JS Bin</title>
<link rel=stylesheet href=https://rawgithub.com/yesmeck/jquery-jsonview/master/dist/jquery.jsonview.css />
<script type=text/javascript src=http://code.jquery.com/jquery.min.js></script>
<script type=text/javascript src=https://rawgithub.com/yesmeck/jquery-jsonview/master/dist/jquery.jsonview.js></script>
<script type=text/javascript>
var json = {hey: guy,anumber: 243,anobject: {whoa: nuts,anarray: [1,2,thr<h1>ee],anotherarray: [1, 2], more:stuff},awesome: true,bogus: false,meaning: null, japanese:明日がある。, link: http://jsonview.com, notLink: http://jsonview.com is great};
$(function() {
$('#json').JSONView(json);
$('#collapse-btn').on('click', function() {
$('#json').JSONView('collapse');
});
$('#expand-btn').on('click', function() {
$('#json').JSONView('expand');
});
$('#toggle-btn').on('click', function() {
$('#json').JSONView('toggle');
});
$('#toggle-level1-btn').on('click', function() {
$('#json').JSONView('toggle', 1);
});
$('#toggle-level2-btn').on('click', function() {
$('#json').JSONView('toggle', 2);
});
});
</script>
</head>
<body>
<br/>
<button id=collapse-btn>Collapse</button>
<button id=expand-btn>Expand</button>
<button id=toggle-btn>Toggle</button>
<button id=toggle-level1-btn>Toggle level1</button>
<button id=toggle-level2-btn>Toggle level2</button> <p id=json></p>
</body>
</html>
如demo所示，显示格式化的json
【相关推荐】
1. 免费h5在线视频教程
2. HTML5 完整版手册
3. gree020.cn原创html5视频教程
以上就是html格式化json的实例代码的详细内容，更多请关注双恒网络其它相关文章！
声明：本站所有文章，如无特殊说明或标注，均为本站原创发布。任何个人或组织，在未征得本站同意时，禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益，可联系我们进行处理。
