js 拼接table 的方法
<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 的方法的更多相关文章
- js拼接table查询信息部分
其一: $("#datagrid").empty(); var a=0; <order-rows> a++; $("#datagrid").appe ...
- Js 合并 table 行 的实现方法
Js 合并 table 行 的实现方法 需求如下: 某公司的员工档案,如下, 经理看员工的信息不是很清晰: 姓名 所在学校 毕业时间 张三 小学 2000 张三 中学 2006 张三 大学 2010 ...
- 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; ...
- 使用ASP.NET MVC局部视图避免JS拼接HTML,编写易于维护的HTML页面
以前使用ASP.NET WebForm开发时,喜欢使用Repeater控件嵌套的方式开发前台页面,这样就不用JS拼接HTML或者后台拼接HTML了,写出的HTML页面美观.简捷.易于维护,由于不用JS ...
- java后台获取和js拼接展示信息
java后台获取和js拼接展示信息: html页面代码: <div class="results-bd"> <table id="activityInf ...
- js操作table倒叙显示序号的问题
今天遇到一奇葩问题,就是在js添加table时,序号是倒叙显示的,而且数据库查出来时正序的,为什么显示是倒叙的呢? 我百度一番,终于有了结果: var newRow=table.insertRow(- ...
- 常见JS(JavaScript)冲突解决方法
1.一般JS冲突解决办法 a.最容易出现的就是js的命名冲突 ①.变量名冲突 变量有全局变量和局部变量当全局变量变量和局部变量名称一致时,就会js冲突,由于变量传递数值或地址不同就会产生JavaScr ...
- IE 不兼容的几个js问题及解决方法
IE 不兼容的几个js问题及解决方法 1 Table的问题 在动态新增tr或者td时,createElecment() 一般用appendChild();都不生效,解决办法是用新增tbody, 如 ...
- IE 不兼容的几个js问题及解决方法1
IE 不兼容的几个js问题及解决方法 1 Table的问题 在动态新增tr或者td时,createElecment() 一般用appendChild();都不生效,解决办法是用新增tbody, 如 ...
随机推荐
- Python 项目实践一(外星人入侵小游戏)第二篇
接着上次的继续学习. 一 创建一个设置类 每次给游戏添加新功能时,通常也将引入一些新设置.下面来编写一个名为settings的模块,其中包含一个名为Settings的类,用于将所有设置存储在一个地方, ...
- (转)Maven依赖的jar包下载不了、jar更新不了的解决办法
场景一: 使用Maven的同学可能偶尔会遇到这种情况:pom.xml中依赖了项目需要的某个jar文件,但是使用Maven –> update project 还是没办法下载该jar到项目中,你可 ...
- org.springframework.web.HttpMediaTypeNotAcceptableException: Could not find acceptable representation
异常信息 org.springframework.web.HttpMediaTypeNotAcceptableException: Could not find acceptable represen ...
- 《ActiveMQ in Action》【PDF】下载
内容介绍TheApache ActiveMQ message broker is an open source implementation ofthe Java Message Service sp ...
- 小白的Python之路 day2 文件操作
文件操作 对文件操作流程 打开文件,得到文件句柄并赋值给一个变量 通过句柄对文件进行操作 关闭文件 现有文件如下 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 1 ...
- JavaScript:AOP实现
AOP的概念,使用过Spring的人应该都不陌生了.Dojo中,也是支持AOP的.对于JavaScript的其他框架.库不知道有没有AOP的支持.相信即便没有支持,也不会太远了.下面就介绍一下使用Ja ...
- C:函数:功能:实现字符数组中所有字母的倒序存放并输出
前两天小测碰到一道题,建立一个函数,功能:实现字符数组中所有字母的倒序存放并输出,一开始觉得简单跟数字数组差不多,运行一下发现很多格式错误,这些是不必要的错误,现在就来说下,先说一下代码思路:定义一个 ...
- C++ 头文件系列(set)
简介 头文件包含set.multiset两个类模版,这里要描述的概念与map非常相似,甚至连成员函数都几乎一样,所以这篇随笔会很短. set set如果翻译成中文应该是集合的意思,这里更确切的说是唯一 ...
- 数据库入门(以MySQL为例)
一.数据库中的概念 1.数据库是用户存放数据.访问数据.操作数据的存储仓库,用户的各种数据被有组织地存放在数据库中.可以随时被有权限的用户查询.统计.添加.删除.和修改.可以说,数据库是长期存储在计算 ...
- php按照中文首字母排序
1> 网络上很多php的工具类可以将汉字转为拼音: 2> 将拼音进行排序即可 另一种则是类似mysql转码方式: 1 foreach ($array as $key=>$value) ...