javascript - table td单元格生成tr问题
问题描述
假设现在有10个td的json对象,td的colspan属性值取1-3, 现在要把它们变成td放到tr中. td的colspan为1时,tr里放3个td,colspan为2时,tr里放两个td.colspan为3时,tr里放3个td. 怎么做到?
问题解答
回答1:<tr ng-if='$scope.colspan === 1'> <td></td> <td></td> <td></td></tr><tr ng-if='$scope.colspan === 2'> <td></td> <td></td></tr><tr ng-if='$scope.colspan === 3'> <td></td> <td></td> <td></td></tr>
用angular>ng-if解决
回答2:随便猜了下你的想法。。
var json = [{ colspan: 1, title: 1}, { colspan: 2, title: 2}, { colspan: 3, title: 3}]document.body.innerHTML = ’<table>’+ generateTr(json) +’</table>’function generateTr(json) { var tr = [] for (var i = 0, l = json.length; i < l; i++) {var item = json[i], tds = []for (var j = 0, k = Math.ceil(3 / item.colspan); j < k; j++) { tds.push(’<td’ + (j == 0 ? ’ colspan='’ + item.colspan+’'’ : ’’) + ’>’ + item.title + ’</td>’)}tr.push(’<tr>’ + tds.join(’’) + ’</tr>’) } return tr.join(’’)}
相关文章:
1. javascript - 一排三个框,各个框的间距是15px,距离外面的白框间距也是15px,这个css怎么写?2. javascript - 如何利用vue组件 动态生成router-link3. html5 - javascript写业务有用到什么编程范式没?4. html5 - vue-cli 装好了 新建项目的好了,找不到项目是怎么回事?5. javascript - immutable配合react提升性能?6. javascript - vue 手机端项目在进入主页后 在进入子页面,直接按返回出现空白情况7. css3 - 微信前端页面遇到的transition过渡动画的bug8. javascript - jQuery post()方法,里面的请求串可以转换为GBK编码么?可以的话怎样转换?9. python3.x - python 中的maketrans在utf-8文件中该怎么使用10. mysql - C#连接数据库时一直这一句出问题int i = cmd.ExecuteNonQuery();

网公网安备