javascript - sel td jadual menjana masalah tr

Question

Andaikan terdapat 10 objek json bagi td, dan nilai atribut colspan bagi td ialah 1-3 Sekarang kita perlu mengubahnya menjadi td dan meletakkannya dalam tr Apabila colspan bagi td ialah 1, masukkan 3 td dalam tr. dan colspan ialah 2. Bila, masukkan dua td dalam tr Apabila colspan ialah 3, masukkan 3 tds dalam tr

Answer 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>

Diselesaikan dengan sudut>ng-jika

Answer 2

Teka sahaja apa yang anda fikirkan. .

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('')
}