javascript 报表 操作
日期：2014-05-16 浏览次数：20406 次
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);
???
