php将json渲染到前端table,json转换成table？

研究了一下午，贴出自己的代码把，有的地方是土办法就是了，而且改了结构

Title

th, td {

vertical-align: middle !important;

text-align: center;

}

h1 {

text-align: center;

}

示例

救助月份救助单位救助类别救助人次

20160120512232061223

效果

救助月份救助单位救助类别救助人次救助金额

var data = [

{

label: "2016年01月",

children: [

{

label: "单位1",

children: [

{

label: "救助类别1",

jzrc: "23",

jzje: "24"

}

]

},

{

label: "单位2",

children: [

{

label: "救助类别3",

jzrc: "25",

jzje: "26"

},

{

label: "救助类别4",

jzrc: "27",

jzje: "28"

}

]

},

{

label: "单位3",

children: [

{

label: "救助类别5",

jzrc: "25",

jzje: "28"

},

{

label: "救助类别6",

jzrc: "22",

jzje: "21"

},

{

label: "救助类别7",

jzrc: "11",

jzje: "111"

}

]

}

]

},

{

label: "2016年02月",

children: [

{

label: "单位4",

children: [

{

label: "救助类别8",

jzrc: "11",

jzje: "22"

}

]

}

]

}

];

var $tBody = $("#demo tbody");

/**

* 查找字符串出现次数

* @param str

* @param substr

* @returns {*}

*/

function countSubstr(str, substr) {

var count;

var reg = "/" + substr + "/gi"; //查找时忽略大小写

reg = eval(reg);

if (str.match(reg) == null) {

count = 0;

} else {

count = str.match(reg).length;

}

return count;

//返回找到的次数

}

/**

* 根据数据判断子级是不是都已经渲染完成

* @param data

*/

function isChildrenRendered(data) {

var isRendered = true;

if (typeof data == 'undefined') console.info(data);

for (var i = 0; i < data.length; i++) {

if (!data[i].rendered) {

isRendered = false;

break;

} else {

if (data[i].children) {

for (var j = 0; j < data[i].children.length; j++) {

if (!data[i].children[j].rendered) {

if (isRendered) {

isRendered = false;

break;

}

}

}

}

}

}

return isRendered;

}

function addOne(data) {

//TODO 土办法：先将json转换成字符串，然后查找某个必有属性，从而得出需要几行

var counts = countSubstr(JSON.stringify(data), 'jzje');

for (var i = 0; i < counts; i++) {

var $tr = $("

");

//添加月份

if (!data.rendered) {

$tr.append("

" + data.label + "");

data.rendered = true;

}

for (var j = 0; j < data.children.length; j++) {

//如果子级还没渲染完成

if (!isChildrenRendered(data.children[j].children)) {

if (!data.children[j].rendered) {

data.children[j].rendered = true;

//添加救助单位

$tr.append("

" + data.children[j].label + "");

}

for (var k = 0; k < data.children[j].children.length; k++) {

if (!data.children[j].children[k].rendered) {

data.children[j].children[k].rendered = true;

//添加救助类别、救助人次、救助金额

$tr.append("

" + data.children[j].children[k].label + "");

$tr.append("

" + data.children[j].children[k].jzrc + "");

$tr.append("

" + data.children[j].children[k].jzje + "");

break;

}

}

break;

}

}

$tBody.append($tr);

}

}

for (var i = 0; i < data.length; i++) {

addOne(data[i]);

}