<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. 原生JS与jQuery操作DOM对比

    一.创建元素节点 1.1 原生JS创建元素节点 document.createElement("p"); 1.2 jQuery创建元素节点 $('<p></p&g ...

  2. 【Sqlserver系列】初级思维导图

    1   概述 本篇文章主要概述Sqlserver思维导图. 2   具体内容 3   参考文献 [01]https://mp.weixin.qq.com/s/USNMslpvu7pWosMZnVTPd ...

  3. 十五、Spring Boot 环境变量读取 和 属性对象的绑定

    凡是被spring管理的类,实现接口 EnvironmentAware 重写方法 setEnvironment 可以在工程启动时,获取到系统环境变量和application配置文件中的变量. 如: @ ...

  4. 初装Ubuntu一般配置

    1. 开启ssh远程 2.修改root密码 sudo passwd 输入两次密码. 3.授权普通用户root权限 修改 /etc/sudoers 文件,找到下面一行,在root下面添加一行,如下所示: ...

  5. python filter map reduce

    filter(function, iterable): Construct a list from those elements of iterable for which function retu ...

  6. 安装Redis后RedisDesktopManager无法连接

    1.查看端口,发现端口不通 2.修改安装redis的目录的redis.conf文件,把bind改为虚拟机的本机ip 3.关闭虚拟机的防火墙 #1.查看防火墙状态[root@localhost src] ...

  7. Spring 链接数据库

    一.前言 Spring 现在是我们在做 JavaWeb 开发中,用的最主流的框架.以后是不是我们暂时不知道,但现在是.废话不多我就介绍 Spring 中.链接数据库的三种方式: git源码地址 需要的 ...

  8. sql基础题目测试及正确答案

    在网上做了一套基本的sql题目,以下是我的写的答案,适合基础人员练练 --创建测试数据 use test create table Student(S# varchar(10),Sname nvarc ...

  9. 小白的Python之路 day4 装饰器前奏

    装饰器前奏: 一.定义: 1.装饰器本质是函数,语法都是用def去定义的 (函数的目的:他需要完成特定的功能) 2.装饰器的功能:就是装饰其他函数(就是为其他函数添加附加功能) 二.原则: 1. 不能 ...

  10. OC学习13——Foundation框架中的集合

    OC集合类是一些非常有用的工具类,它可以用于存储多个数量不等的对象,并可以实现常用的数据结构(栈.队列等),此外,OC集合还可用于保存具有映射关系的关联数组.OC的集合大致可以分为:NSArray.N ...