代码格式化插件

效果图为：

使用了OSChina会员沙王重名了提供的代码实现https://www.oschina.net/code/snippet_119610_11825

html部分：

引入css文件和js文件

<link rel="stylesheet" href="css/s.css" />

<script type="text/javascript" src="js/c.js" ></script>

布局

<table class="recordTable">

<thead>
<tr>
<th>修改项目</th>
<th>修改前【<span class="recordName">伍巍巍</span>】<span class="recordTime">2018-06-12 16:04:06</span></th>
<th>修改后【<span class="recordName">张pc</span>】<span class="recordTime">2018-06-12 16:04:06</span></th>
</tr>
</thead>
<tbody>
<tr>
<td>修改请求参数</td>
<td class="code">
{"data":{"cooper_list":[111],"manager":{"id":"50017","email":"648029882@qq.com","name":"songXX"},"myrole":"admin"},"status":1}

</td>
<td class="code">
{"data":{"cooper_list":[222],"manager":{"id":"50018","email":"648029882@qq.com","name":"songXX"},"myrole":"admin"},"status":1}

</td>
</tr>
</tbody>
</table>

<table class="recordTable">
<thead>
<tr>
<th>修改项目</th>
<th>修改前【<span class="recordName">伍巍巍</span>】<span class="recordTime">2018-06-12 16:04:06</span></th>
<th>修改后【<span class="recordName">张pc</span>】<span class="recordTime">2018-06-12 16:04:06</span></th>
</tr>
</thead>
<tbody>
<tr>
<td>修改返回参数</td>
<td class="code">
{"data":{"cooper_list":[],"manager":{"id":"50017","email":"648029882@qq.com","name":"songXX"},"myrole":"admin"},"status":1}

</td>
<td class="code">
{"0":"优","10":"良","20":"轻度","30":"中度","40":"重度","50":"严重"}

</td>
</tr>
</tbody>

</table>

js部分：

对c.js里的Process函数修改如下：

function Process(){
  SetTab();
  window.IsCollapsible = false;
  console.info($(".code").length);
  var length = $(".code").length;
  for(var i = 0;i<length;i++){
  var json = $(".code").eq(i).text();
  console.info(json);
  var html = "";
  try{
    if(json == "") json = "\"\"";
    var obj = eval("["+json+"]");
    html = ProcessObject(obj[0], 0, false, false, false);
    $(".code").eq(i).html("<PRE class='CodeContainer'>"+html+"</PRE>");
  }catch(e){
    alert("JSON数据格式不正确:\n"+e.message);
    $(".code").eq(i).html("");
  }
  }
  

}

然后在c.js调用Process()；函数。