<html>

  <head>

   <title>test page</title>

   <script type='text/javascript'>

     <!--

   function createTable() {

       var t = document.createElement('table');

       for (var i = 0; i < 2000; i++) {

        var r = t.insertRow();

        for (var j = 0; j < 5; j++) {

         var c = r.insertCell();

         c.innerHTML = i + ',' + j;

        }

       }

       document.getElementById('table1').appendChild(t);

      t.setAttribute('border', '1');

   }

   function createTable2() {

       var t = document.createElement('table');

       var b = document.createElement('tbody');

       for (var i = 0; i < 2000; i++) {

        var r = document.createElement('tr');

        for (var j = 0; j < 5; j++) {

         var c = document.createElement('td');

         var m = document.createTextNode(i + ',' + j);

         c.appendChild(m);

         r.appendChild(c);

        }

        b.appendChild(r);

       }

       t.appendChild(b);

       document.getElementById('table1').appendChild(t);

      t.setAttribute('border', '1');

   }

   function createTable3() {

    var data = '';

    data += '<table border=1><tbody>';

       for (var i = 0; i < 2000; i++) {

        data += '<tr>';

        for (var j = 0; j < 5; j++) {

         data += '<td>' + i + ',' + j + '</td>';

        }

        data += '</tr>';

       }

       data += '</tbody><table>';

       document.getElementById('table1').innerHTML = data;

   }

   function createTable4() {

    var data = new Array();

    data.push('<table border=1><tbody>');

       for (var i = 0; i < 2000; i++) {

        data.push('<tr>');

        for (var j = 0; j < 5; j++) {

         data.push('<td>' + i + ',' + j + '</td>');

        }

        data.push('</tr>');

       }

       data.push('</tbody><table>');

       document.getElementById('table1').innerHTML = data.join('');

   }

   function showFunctionRunTime(f) {

    var t1 = new Date();

    f();

    var t2 = new Date();

    alert(t2 - t1);

   }

     //-->

   </script>

  </head>

 <body>

  <div id="table1" style="border: 1px solid black">

  </div>

  <script>

   showFunctionRunTime(createTable);

   showFunctionRunTime(createTable2);

   showFunctionRunTime(createTable3);

   showFunctionRunTime(createTable4);

  </script>

 </body>

</html>

原文连接：http://blog.51cto.com/jeoff/225188

js 拼接table 的方法的更多相关文章

  1. js拼接table查询信息部分

    其一: $("#datagrid").empty(); var a=0; <order-rows> a++; $("#datagrid").appe ...

  2. Js 合并 table 行 的实现方法

    Js 合并 table 行 的实现方法 需求如下: 某公司的员工档案,如下,  经理看员工的信息不是很清晰: 姓名 所在学校 毕业时间 张三 小学 2000 张三 中学 2006 张三 大学 2010 ...

  3. html table表格导出excel的方法 html5 table导出Excel HTML用JS导出Excel的五种方法 html中table导出Excel 前端开发 将table内容导出到excel HTML table导出到Excel中的解决办法 js实现table导出Excel，保留table样式

    先上代码   <script type="text/javascript" language="javascript">   var idTmr; ...

  4. 使用ASP.NET MVC局部视图避免JS拼接HTML，编写易于维护的HTML页面

    以前使用ASP.NET WebForm开发时,喜欢使用Repeater控件嵌套的方式开发前台页面,这样就不用JS拼接HTML或者后台拼接HTML了,写出的HTML页面美观.简捷.易于维护,由于不用JS ...

  5. java后台获取和js拼接展示信息

    java后台获取和js拼接展示信息: html页面代码: <div class="results-bd"> <table id="activityInf ...

  6. js操作table倒叙显示序号的问题

    今天遇到一奇葩问题,就是在js添加table时,序号是倒叙显示的,而且数据库查出来时正序的,为什么显示是倒叙的呢? 我百度一番,终于有了结果: var newRow=table.insertRow(- ...

  7. 常见JS(JavaScript)冲突解决方法

    1.一般JS冲突解决办法 a．最容易出现的就是js的命名冲突 ①.变量名冲突 变量有全局变量和局部变量当全局变量变量和局部变量名称一致时,就会js冲突,由于变量传递数值或地址不同就会产生JavaScr ...

  8. IE 不兼容的几个js问题及解决方法

    IE 不兼容的几个js问题及解决方法 1 Table的问题   在动态新增tr或者td时,createElecment() 一般用appendChild();都不生效,解决办法是用新增tbody, 如 ...

  9. IE 不兼容的几个js问题及解决方法1

    IE 不兼容的几个js问题及解决方法 1 Table的问题   在动态新增tr或者td时,createElecment() 一般用appendChild();都不生效,解决办法是用新增tbody, 如 ...

随机推荐

  1. 01_GIT基础、安装

     1 为什么选择GIT 分布式,强调个体 公共server压力和数据量都不会太大 速度快.灵活 随意两个开发人员之间能够非常easy的解决冲突 离线工作 每日工作备份 能够吃懊悔药 2  GIT基 ...

  2. 基于Office 365的随需应变业务应用平台

    作者:陈希章 发表于 2017年9月7日 这是我去年10月底在微软技术大会(Microsoft Ignite 2016) 上面的演讲主题,承蒙大家抬爱,也沾了前一场明星讲师的光,我记得会场几乎是满座. ...

  3. 输入url会发什什么

    从输入url到页面加载完成发生了什么 整体来说有几个基本的点: 1.浏览器的地址栏输入url并按下回车 2.浏览器查找当前url是否存在缓存,并比较缓存是否过期 3.DNS解析url对应的IP 4.根 ...

  4. 码农的奋斗之路 CTO说 读后感

    拜读了各位大神的分享,对CTO的职责有了进一步的认识. 什么是CTO? CTO需要具备哪些技能? CTO与管理 CTO的作用是什么? 如何体现CTO的价值? CTO撸不撸代码? 小结

  5. Java项目中使用Redis缓存案例

    缓存的目的是为了提高系统的性能,缓存中的数据主要有两种: 1.热点数据.我们将经常访问到的数据放在缓存中,降低数据库I/O,同时因为缓存的数据的高速查询,加快整个系统的响应速度,也在一定程度上提高并发 ...

  6. Java中流-----个人总结心得

    流 字符流 字节流 缓冲区 数据流---用于传输数据.IO流---Input/Output流.数据从外部流向程序---输入流:数据从程序流向外部的时候--输出流.读取一个文件---数据从文件流向程序- ...

  7. MPSOC之3——centos环境配置及petalinux安装及使用

    ubuntu虽然能正常安装,但是build时会出现闪退情况,闪退后一切归零,没啥错误提示,改用centos来安装petalinux. 0.环境 vmware pro 14,centos 7.3 pet ...

  8. AsyncLocal的运作机制和陷阱

    这是今天帮柠檬分析一个AsyncLocal相关的问题时发现的. 试想这个代码输出的值是多少? using System; using System.Threading; using System.Th ...

  9. Grafana4.2安装

    一.文件准备 1.1 文件名称 grafana-4.2.0-1.x86_64.rpm 1.2 下载地址 https://grafana.com/grafana/download 二.工具准备 2.1 ...

  10. SignalR简单Demo

    我们实现一个简单的消息通知的Demo 在NuGet中添加SignalR引用 install-package Microsoft.AspNet.SignalR 然后我们创建一个类来引用Hub类 name ...