提取Chrome的JSONView扩展以便在页面上显示美化了的JSON数据

来源:互联网 发布:it桔子 类似网站 编辑:程序博客网 时间:2024/04/30 03:09

类似的组件有很多,例如:http://www.w3resource.com/JSON/online-JSON-viewer.php

这里将提取chrome的jsonview插件。

1. Chrome浏览器安装JSONView扩展,然后在本地打开扩展的安装路径(提示,win7上大致的路径为:C:\Users\用户名\AppData\Local\Google\Chrome\User Data\Default\Extensions)

2. 提取以下文件备用:

jsonview.css

jsonview-core.css

workerFormatter.js

3. 创建如下测试html文件。

<link rel="stylesheet" href="jsonview.css"></link>
<link rel="stylesheet" href="jsonview-core.css"></link>
<script src="workerFormatter.js"></script>
<div id="jsonContent"></div>
<script>
var a = {a:1, b:'', c:null};
document.getElementById("jsonContent").innerHTML = jsonToHTML(a);
</script>

0 0