ie上有个Bug,js创建的table,默认给你插上了一个空的tbody,所以要移除掉这个tbody
for(var i = 0 ; i < table.childNodes.length ; i++) {
??? ??? ??? ??? if(table.childNodes[i].tagName == 'TBODY' && table.childNodes[i].innerHTML == '') {
??? ??? ??? ??? ??? table.removeChild(table.childNodes[i]);
??? ??? ??? ??? ??? break;
??? ??? ??? ??? }
??? ??? ??? }
?
?
?
<html>
??? <head>
??? ??? <meta http-equiv="Content-Type" content="text/html;charset=UTF-8"/>
??? </head>
??? <body>
??? ??? <script>
??? ??? ??? var frag = document.createDocumentFragment();
??? ??? ??? var table = document.createElement('table');
??? ??? ??? frag.appendChild(table);
??? ??? ???
??? ??? ??? var caption = table.createCaption();
??? ??? ??? caption.innerHTML = '<font color="red">我是标题，哈哈哈</font>';
??? ??? ??? var thead = table.createTHead();
??? ??? ??? var headrow = thead.insertRow(0);
??? ??? ??? var c = headrow.insertCell(0);
??? ??? ??? c.innerHTML = '表头内容1';
??? ??? ??? c = headrow.insertCell(1);
??? ??? ??? c.innerHTML = '表头内容2';
??? ??? ???
??? ??? ??? headrow = thead.insertRow(1);
??? ??? ??? c = headrow.insertCell(0);
??? ??? ??? c.innerHTML = '表头内容3';
??? ??? ??? c = headrow.insertCell(1);
??? ??? ??? c.innerHTML = '表头内容4';
??? ??? ??? var tbody = document.createElement('tbody');
??? ??? ??? table.appendChild(tbody);
??? ??? ??? var bodyrow = tbody.insertRow(0);
??? ??? ??? c = bodyrow.insertCell(0);
??? ??? ??? c.innerHTML = '表体内容1';
??? ??? ??? c = bodyrow.insertCell(1);
??? ??? ??? c.innerHTML = '表体内容2';
??? ??? ???
??? ??? ??? bodyrow = tbody.insertRow(1);
??? ??? ??? c = bodyrow.insertCell(0);
??? ??? ??? c.innerHTML = '表体内容3';
??? ??? ??? c = bodyrow.insertCell(1);
??? ??? ??? c.innerHTML = '表体内容4';
??? ??? ???
??? ??? ??? tbody = document.createElement('tbody');
??? ??? ??? table.appendChild(tbody);
??? ??? ??? var bodyrow = tbody.insertRow(0);
??? ??? ??? c = bodyrow.insertCell(0);
??? ??? ??? c.innerHTML = '表体内容5';
??? ??? ??? c = bodyrow.insertCell(1);
??? ??? ??? c.innerHTML = '表体内容6';
??? ??? ???
??? ??? ??? bodyrow = tbody.insertRow(1);
??? ??? ??? c = bodyrow.insertCell(0);
??? ??? ??? c.innerHTML = '表体内容7';
??? ??? ??? c = bodyrow.insertCell(1);
??? ??? ??? c.innerHTML = '表体内容8';
??? ??? ??? var foot = table.createTFoot();
??? ??? ??? var footrow = foot.insertRow(0);
??? ??? ??? c = footrow.insertCell(0);
??? ??? ??? c.innerHTML = '表尾内容1';
??? ??? ??? c = footrow.insertCell(1);
??? ??? ??? c.innerHTML = '表尾内容2';
??? ??? ???
??? ??? ??? footrow = foot.insertRow(1);
??? ??? ??? c = footrow.insertCell(0);
??? ??? ??? c.innerHTML = '表尾内容3';
??? ??? ??? c = footrow.insertCell(1);
??? ??? ??? c.innerHTML = '表尾内容4';
??? ??? ???
??? ??? ??? for(var i = 0 ; i < table.childNodes.length ; i++) {
??? ??? ??? ??? if(table.childNodes[i].tagName == 'TBODY' && table.childNodes[i].innerHTML == '') {
??? ??? ??? ??? ??? table.removeChild(table.childNodes[i]);
??? ??? ??? ??? ??? break;
??? ??? ??? ??? }
??? ??? ??? }
??? ??? ???
??? ??? ??? document.body.appendChild(frag);
??? ??? ???
??? ??? ??? alert('获得标题:' + table.caption.innerHTML);
??? ??? ??? alert('获得表头:' + table.tHead.innerHTML);
??? ??? ???
??? ??? ??? alert('对表头进行遍历');
??? ??? ??? for(var i = 0 ; i < table.tHead.rows.length ; i++) {
??? ??? ??? ??? var row = table.tHead.rows[i];
??? ??? ??? ??? for(var j = 0 ; j < row.cells.length ; j++) {
??? ??? ??? ??? ??? alert('第' + (i+1) + '行 第' + (j + 1) + '列内容:' + row.cells[j].innerHTML);
??? ??? ??? ??? }
??? ??? ??? }
??? ??? ??? alert('对表体进行遍历:' + table.tBodies.length);
??? ??? ???
??? ??? ??? for(var w = 0 ; w < table.tBodies.length ; w++) {
??? ??? ??? ??? tbody = table.tBodies[w];
??? ??? ??? ??? for(var i = 0 ; i < tbody.rows.length ; i++) {
??? ??? ??? ??? ??? var row = tbody.rows[i];
??? ??? ??? ??? ??? for(var j = 0 ; j < row.cells.length ; j++) {
??? ??? ??? ??? ??? ??? alert('第' + (w + 1) + '个表体的第' + (i+1) + '行 第' + (j + 1) + '列内容:' + row.cells[j].innerHTML);
??? ??? ??? ??? ??? }
??? ??? ??? ??? }
??? ??? ??? }
??? ??? ???
??? ??? ??? alert('对表尾进行遍历:');
??? ??? ??? for(var i = 0 ; i < table.tFoot.rows.length ; i++) {
??? ??? ??? ??? var row = table.tFoot.rows[i];
??? ??? ??? ??? for(var j = 0 ; j < row.cells.length ; j++) {
??? ??? ??? ??? ??? alert('表尾第' + (i + 1) + '行 第' + (j + 1) + '列内容:' + row.cells[j].innerHTML);
??? ??? ??? ??? }
??? ??? ??? }
??? ??? ??? /*
??? ??? ??? alert('使用rows属性: ' + table.rows.length);
??? ??? ???
??? ??? ??? setTimeout(function() {
??? ??? ??? ??? alert('删除标题');
??? ??? ??? ??? table.deleteCaption();
??? ??? ??? } , 1000);
??? ??? ??? setTimeout(function() {
??? ??? ??? ??? alert('删除表头');
??? ??? ??? ??? table.deleteTHead();
??? ??? ??? }, 1000);
??? ??? ???
??? ??? ??? setTimeout(function() {
??? ??? ??? ??? alert('删除表尾');
??? ??? ??? ??? table.deleteTFoot();
??? ??? ??? }, 1000);
??? ??? ???
??? ??? ??? table.deleteRow(7);
??? ??? ??? */
??? ??? ??? /*
??? ??? ??? row = table.insertRow(8);
??? ??? ??? cell = row.insertCell(0);
??? ??? ??? cell.innerHTML = 'append1';
??? ??? ??? cell = row.insertCell(1);
??? ??? ??? cell.innerHTML = 'append2';
??? ??? ??? */
??? ??? ??? table.tFoot.deleteRow(0);
??? ??? </script>
??? </body>
</html>
?
?
table.rows 返回 表头，表体，表尾所有行数之和
table.deleteRow 删除一行， 删除的是 所有的表头，表体，表尾的总和所在的行，从0开始计数
table.insertRow 插入一行，插入的是新的一行，firefox上必须提供插入行所在的位置，
??????????????? 行的位置是所有的表头，表体，表尾之和的那种下标
table.tHead.deleteRow(index);
table.tBody.deleteRow(index);
table.tBodies[1].deleteRow(index);
这种方法也支持，不过删除的是指定的自身区域内的行
?
?