首页 > Web开发 > 详细

js自定义拼接树形表格

时间:2019-09-05 12:24:35      阅读:111      评论:0      收藏:0      [点我收藏+]

技术分享图片

 

 

<script>
function getItemHtml(dataJson) {
var htmlJ = "<div><table border=‘1‘><tr><th>子模型</th><th>指标项</th><th>指标权重(%)</th><th>数据来源</th><th>备注说明</th></tr><tr>";
if (dataJson.result) {
var datas = dataJson.result;
for (var i = 0; i < datas.length; i++) {
// htmlJ += ‘<tr><th rowspan="‘ + datas[i].modelItems.length + ‘">‘ + datas[i]["subModel"] + "</th>";
for (var j = 0; j < datas[i].modelItems.length; j++) {
if (j == 0) {
htmlJ += ‘<tr><th rowspan="‘ + datas[i].modelItems.length + ‘">‘ + datas[i]["subModel"] + "</th>";
}
else {
htmlJ += ‘<tr>‘;
}
htmlJ += "<td>" + datas[i].modelItems[j]["indexItems"] + "</td>";
htmlJ += "<td>" + datas[i].modelItems[j]["indexWeight"] + "</td>";
htmlJ += "<td>" + datas[i].modelItems[j]["dataSource"] + "</td>";
htmlJ += "<td>" + datas[i].modelItems[j]["remark"] + "</td></<td>";
htmlJ += "</tr>";
}
}

}
htmlJ += "</table></div>";
return htmlJ;
}

function load() {
document.getElementById("GoogleAD").innerHTML = "";
var json ={"code":"OK","details":[],"message":"正常","messageCode":0,"result":[
{"id":1,
"modelItems":[{"dataSource":"话题社区","id":22,"indexItems":"发表原创话题次数","indexWeight":"","remark":"","status":0,"subModelId":0},
{"dataSource":"驻村工作","id":23,"indexItems":"参与驻村互动次数、参与驻村互动评论字数","indexWeight":"","remark":"","status":0,"subModelId":0},{"dataSource":"缴纳党费","id":24,"indexItems":"党龄、按时交纳党费率、连续六个月不交纳党费次数","indexWeight":"","remark":"需要提供指标相关数据","status":0,"subModelId":0},
{"dataSource":"违规违纪、不合格党员评价标准","id":25,"indexItems":"各违规违纪类别下的违规违纪次数","indexWeight":"","remark":"需要明确有哪些违规违纪种类以及各类违规违纪的严重程度","status":0,"subModelId":0},
{"dataSource":"一般文章评论及其点赞","id":26,"indexItems":"文章评论字数","indexWeight":"","remark":"","status":0,"subModelId":0}],"modelManageId":0,"modelName":"党员活力指数分析模型","status":0,"subModel":"思想评估"},
{"id":2,
"modelItems":[{"dataSource":"党员志愿服务","id":27,"indexItems":"志愿服务全年达标进度、线上活动完成度(长征路、点亮中国)","indexWeight":"","remark":"","status":0,"subModelId":0}],"modelManageId":0,"modelName":"党员活力指数分析模型","status":0,"subModel":"服务评估"},
{"id":3,
"modelItems":[{"dataSource":"驻村工作","id":28,"indexItems":"驻村辅导预警次数","indexWeight":"","remark":"","status":0,"subModelId":0},{"dataSource":"精准扶贫","id":29,"indexItems":"扶贫任务完成情况评价、扶贫积极性评价","indexWeight":"","remark":"","status":0,"subModelId":0},
{"dataSource":"身边好党员","id":30,"indexItems":"获得好党员评价次数","indexWeight":"","remark":"1、如果文章中有多个党员名字无法确定具体表扬的哪个党员;","status":0,"subModelId":0},
{"dataSource":"远教工作","id":31,"indexItems":"组织自主学习次数","indexWeight":"","remark":"","status":0,"subModelId":0}],"modelManageId":0,"modelName":"党员活力指数分析模型","status":0,"subModel":"工作评估"}]}
document.getElementById("GoogleAD").innerHTML = getItemHtml(json);
}

</script>
 
<body onload="load()">
  <div id="GoogleAD"></div>
</body>

js自定义拼接树形表格

原文:https://www.cnblogs.com/lihong-123/p/11463567.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!