• HTML通过使用JS动态显示table内容


    HTML:

    <table border="1" id="tb">
       <thead>
        <caption>历史知识点对比</caption>
        <tr>
          <th rowspan="2">知识点</th>
          <th rowspan="2">全校得分率</th>
          <th rowspan="2">上次考试教师授课班级得分率</th>
          <th rowspan="2">本次考试教师授课本机得分率</th>
          <th colspan="3">本次分班级</th>
          <th rowspan="2">神经网络预测得分率</th>
           </tr>
           <tr>
          <th>1班</th>
          <th>2班</th>
          <th>3班</th>
        </tr>
      </thead>

    </table>

    JS:

    /*动态显示表格内容*/
        window.onload=function(){
            $.ajax({
                type:"get",
                url:"/getTableData",
                data:{},
                async: false,
                success:function (data) {
                    //var data = eval('('+data+')');
                    for(var i=0;i < data.length;i++){
                        var x=document.getElementById('tb').insertRow();
                        for(var j=0;j < data[i].length;j++){
                            var cell=x.insertCell();
                            cell.innerHTML=data[i][j];
                        }
                    }
               }
            });
        }

    主要使用了DOM的insertRow以及insertCell方法,该JS比较简洁,推荐使用,效果如下:

  • 相关阅读:
    Linux -- touch
    Linux -- ls
    Linux -- 手动新建用户
    Linux -- id
    Linux -- chfn
    Linux -- finger
    Linux -- newgrp
    浅谈java中线程和操作系统线程
    java虚拟机入门(五)- 常见垃圾回收器及jvm实现
    java虚拟机入门(四)-垃圾回收的故事
  • 原文地址:https://www.cnblogs.com/liesun/p/9196555.html
Copyright © 2020-2023  润新知