w3cdom1:创建所有需要的元件
var x = document.createElement('table');
var y = x.appendChild(document.createElement('tbody'));
for (var i=0;i<50;i++)
{
var z = y.appendChild(document.createElement('tr'));
for (var j=0;j<50;j++)
{
var a = z.appendChild(document.createElement('td'));
a.appendChild(document.createTextNode('*'));
}
}
document.getElementById('writeroot').appendChild(x);
w3cdom2：只在第一次的时候创建，以后再需要就clone
var x = document.createElement('table');
var y = x.appendChild(document.createElement('tbody'));
var tr = document.createElement('tr');
var td = document.createElement('td');
var ast = document.createTextNode('*');
for (var i=0;i<50;i++)
{
var z = y.appendChild(tr.cloneNode(true));
for (var j=0;j<50;j++)
{
var a = z.appendChild(td.cloneNode(true));
a.appendChild(ast.cloneNode(true));
}
}
document.getElementById('writeroot').appendChild(x);
tableMethods: 使用W3C DOM的表格方法
var x = document.createElement('table');
var y = x.appendChild(document.createElement('tbody'));
for (var i=0;i<50;i++)
{
var z = y.insertRow(0);
for (var j=0;j<50;j++)
{
var a = z.insertCell(0).appendChild(document.createTextNode('*'));
}
}
document.getElementById('writeroot').appendChild(x);
innerHTML1: 把一串字符串连接起来
var string = '<table><tbody>';
for (var i=0;i<50;i++)
{
string += '<tr>';
for (var j=0;j<50;j++)
{
string += '<td>*</td>';
}
string += '</tr>';
}
string += '</tbody></table>';
document.getElementById('writeroot').innerHTML = string;
innerHTML2: 把字符串push到数组里，再把数组串成一个字符串
var string = new Array();
string.push('<table><tbody>');
for (var i=0;i<50;i++)
{
string.push('<tr>');
for (var j=0;j<50;j++)
{
string.push('<td>*</td>');
}
string.push('</tr>');
}
string.push('</tbody></table>');
var writestring = string.join('');
document.getElementById('writeroot').innerHTML = writestring;
从原文网站上的数据来看，最后一种方法是最快的，前两种w3c的东东在IE/Win里不是一般的慢的。不过最快的方法在IE5/Win和IE5.x/Mac里不支持，需要一个
quirksmode.js来让它间接的支持。
看了原文，除了了解这些方法的速度外，还了解了这几种不同的方法，算是一点点收获吧。
PS：innerHTML不是标准，不过好像目前的浏览器都支持的说。