sfk1993
sfk1993
采纳率72.7%
2016-03-11 02:18 阅读 1.4k

新手问题(在js中实现表格效果)

这种表格在js中用循环怎么实现?在HTML中一行一行的敲很累图片说明图片

  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 复制链接分享

6条回答 默认 最新

  • showbo GoCityPass新加坡曼谷通票 2016-03-11 04:07
    
    <script>
        var data = [
            ['星期一上午第1节课', '星期一上午第2节课', '星期一上午第3节课', '星期一上午第4节课', '星期一上午第5节课', '星期一上午第6节课'],
            [],//星期二的依次类推,下面的也是,注意课程位置,没有放个空字符或者false占位
            [],
            [],
            [],
            []];
    </script>
    <table border="1">
        <tr><th>项目</th><th colspan="5">上课</th><th colspan="2">休息</th></tr>
        <tr><th>星期</th><th>星期一</th><th>星期二</th><th>星期三</th><th>星期四</th><th>星期五</th><th>星期六</th><th>星期日</th></tr>
        <tr><td rowspan="4">上午</td>
        <script>//输出第一节课
                for (var i = 0; i < 6; i++) document.write('<td>'+(data[i][0]||'未安排')+'</td>');
        </script>
        <td rowspan="4">休息</td></tr>
        <script>
            var s = '';
            //输出上午的3节课
            for (var j = 1; j < 4; j++) {
                s += '<tr>';
                for (var i = 0; i < 6; i++) s += '<td>' + (data[i][j] || '未安排') + '</td>';
                s += '</tr>';
            }
            document.write(s);
        </script>
        <tr><td rowspan="2">下午</td>
        <script>
            s = '';
            //输出下午第5节课
            for (var i = 0; i < 6; i++) document.write('<td>' + (data[i][4] || '未安排') + '</td>');
        </script>
        <td rowspan="2">休息</td></tr>
        <script>
            var s = '';
            //输出上午的最后节课
                s += '<tr>';
                for (var i = 0; i < 6; i++) s += '<td>' + (data[i][5] || '未安排') + '</td>';
                s += '</tr>';
    
            document.write(s);
        </script>
    </table>
    
    点赞 2 评论 复制链接分享
  • showbo GoCityPass新加坡曼谷通票 2016-03-11 03:52

    你的数据结构呢。。也不是很难,也就8x8的表格,上午,下午,周日这种都有固定的rowspan,colspan了,只需要要循环也就是里面的科目而已

    点赞 1 评论 复制链接分享
  • qq_25093755 白若蓝 2016-03-11 05:33

    关于JS中建立表格的话,一种就是一楼的做法,另外一种是直接$("id").append(此处拼接HTML代码,也就是你的要显示的table数据);

    点赞 1 评论 复制链接分享
  • qq_19891827 qq_19891827 2016-03-11 02:26

    你这个涉及到行列合并的问题,不是很规则的表格,所以用js循环实现不了,要是非得通过js实现的话就很麻烦,不如直接html来的快

    点赞 评论 复制链接分享
  • curry_du curry_du 2016-03-11 03:20

    一行一行敲吧,也不算太多了,哈哈

    点赞 评论 复制链接分享
  • Royal_lr Royal_lr 2016-03-11 05:23

    一般是从数据库中取出来的,,

    点赞 评论 复制链接分享

相关推荐