html格式化输出JSON( 测试接口)
将 json 数据以美观的缩进格式显示出来，借助最简单的 JSON.stringify 函数就可以了，因为此函数还有不常用的后面2个参数。
见MDN https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringify 的描述。
示例代码如下：
<html>
<head>
<meta charset="utf-8" /> <title>hello</title> <style>
pre {outline: 1px solid #ccc; padding: 5px; margin: 5px; }
.string { color: green; }
.number { color: darkorange; }
.boolean { color: blue; }
.null { color: magenta; }
.key { color: red; }
</style>
<script type="text/javascript">
function syntaxHighlight(json) {
if (typeof json != 'string') {
json = JSON.stringify(json, undefined, 2);
}
json = json.replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>');
return json.replace(/("(\\u[a-zA-Z0-9]{4}|\\[^u]|[^\\"])*"(\s*:)?|\b(true|false|null)\b|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?)/g, function(match) {
var cls = 'number';
if (/^"/.test(match)) {
if (/:$/.test(match)) {
cls = 'key';
} else {
cls = 'string';
}
} else if (/true|false/.test(match)) {
cls = 'boolean';
} else if (/null/.test(match)) {
cls = 'null';
}
return '<span class="' + cls + '">' + match + '</span>';
});
} </script>
</head>
<body> <pre id="result"> </pre>
<script type="text/javascript">
var songResJson={
"service": "ALL",
"qt": 581,
"content": {
"answer": {
"song": "如果缘只到遇见",
"album": "如果缘只到遇见",
"artist": "吴奇隆 严艺丹",
"pic_url": "http://p1.music.126.net/-u3WgIXsFNCW7d8Jy7pCEA==/5921969627395387.jpg"
},
"scene": "music"
}
}
document.getElementById('result').innerHTML = syntaxHighlight(songResJson); // $('#result').html(syntaxHighlight(songResJson));
</script> </body>
</html>
html格式化输出JSON( 测试接口)的更多相关文章
- Java - 格式化输出JSON字符串的两种方式
目录 1 使用阿里的fastjson 1.1 项目的pom.xml依赖 1.2 Java示例代码 2 使用谷歌的gson 2.1 项目的pom.xml依赖 2.2 Java示例代码 1 使用阿里的fa ...
- 格式化输出Json对象
1.调用方式: alert(JsonUti.convertToString(jsonObj)); //jsonObj为json对象. 2.格式化输出Json对象方法定义: var JsonUti = ...
- 【Python】格式化输出json
参考文档: Python JSON JSON 函数 使用 JSON 函数需要导入 json 库:import json. 函数 描述 json.dumps 将 Python 对象编码成 JSON 字 ...
- nodejs写入json文件，格式化输出json的方法
假如我需要把data序列化成json字符串,然后写入data.json文件中,代码如下: let str = JSON.stringify(data) fs.writeFile('data.json' ...
- 在html中怎么格式化输出json字符串
#今天的项目用到,看俊哥找到,特此记录下来 步骤: 1.在html页面中输入下面的标签,必须是在pre标签内输出格式才会生效: <pre id="songReqJson"&g ...
- Postman Json测试接口
当传递Json数据时: 1.必须添加http头:content-type:application/json,否则会报错(后台取不到相对应的值) 注意:如果服务端只支持UTF-8,但程序未对提交数据进行 ...
- fastjson格式化输出内容
引入fastjson <!--fastjson--><dependency> <groupId>com.alibaba</groupId> <ar ...
- net.sf.json日期类型格式化输出
net.sf.json 日期类型格式化输出 Date, Timestamp ; 编写工具类 package cn.jorcen.commons.util; import java.text.DateF ...
- SpringBoot中使用Fastjson/Jackson对JSON序列化格式化输出的若干问题
来源 :https://my.oschina.net/Adven/blog/3036567 使用springboot-web编写rest接口,接口需要返回json数据,目前国内比较常用的fastjso ...
随机推荐
- Appium+python自动化（三十九）-Appium自动化测试框架综合实践 - 代码实现（超详解）
简介 经过一段时间的准备,完善的差不多了,继续分享有关Appium自动化测试框架综合实践.想必小伙伴们有点等不及了吧! driver配置封装 kyb_caps.yaml 配置表 参考代码 platfo ...
- mpvue+小程序云开发，纯前端实现婚礼邀请函（相册小程序）
请勿使用本文章及源码作为商业用途! 前言 当初做这个小程序是为了婚礼前的需要,结婚之后,希望这个小程序能够留存下来,特地花了一些空闲时间将小程序转化成为“相册类小程序” 体验码 准备工作 mpvue框 ...
- P中值选址问题的整数规划求解
P中值选址问题的整数规划求解 一 .P-中值问题 p-中值选址问题是一个常见的选址问题. 问题是给定I个需求结点和J个待选设施地点, 要求选择p个地点建立设施, 使得运输成本最低. 下面是个英文的问题 ...
- centos中网卡的配置
配置临时IP: ip a a 192.168.59.100/24 dev ens32 ifconfig ens32 192.168.59.100 up 在Linux最小安装之后,一般需要手动配置网络地 ...
- js获取文件里面的所有文件名
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- IO类
Java的IO体系分为Input/Output和Reader/Writer两类,区别在于Reader/Writer在读写文本时能自动转换内码.基本上,所有的IO类多是配对的,即有XXXInput,就有 ...
- java笔试面试第一天
好久未曾启用我的博客,最近来上海找工作,想将笔试面试的过程做个记录,毕竟有总结才有提高嘛.今天算是笔试面试正式开始第一天吧,以下就是我的笔试总结(没有原题了,只有知识点): 笔试题1:java sta ...
- Ubuntu 16.04安装JDK并配置环境变量
系统版本:Ubuntu 16.04 JDK版本:jdk1.8.0_121 1.官网下载JDK文件jdk-8u121-linux-x64.tar.gz 我这里下的是最新版,其他版本也可以 2.创建一个目 ...
- 网站搭建-2-本地网站搭建-安装Linux虚拟机/ 安装IIS Windows
搭建网站-1-域名申请参见公众号 生物信息系统(swxxxt) 首先,已经拥有了一个可以正常使用的域名. 之前买了两年的阿里的服务器,由于是Windows的,最后不了了之了(因为当时找的代码都是lin ...
- Python文件写入时的编码问题解决
如下代码: import sys import os import django root_dir = os.path.join(os.path.dirname(os.path.abspath(__f ...