日期:2014-05-16 浏览次数:20422 次
function creatTable() { //用createElement函数创建tbody,tr,td,textNode元素 //关于各元素的意义不在此描述 var tbody= document.createElement("tbody"); var row=document.createElement("tr"); var cell=document.createElement("td"); var textNode=document.createTextNode("test"); //可用于理解textNode //alert(textNode.length); 这里是test的长度4 //alert(textNode.toString());当然就是test了 //因为各元素都是节点与子节点的关系所以用appendChild()函数将各节点连接起来 cell.appendChild(textNode); row.appendChild(cell); tbody.appendChild(row); //现在可以将创建好的TBODY元素加入指定ID的table中了 document.getElementById("ww").appendChild(tbody); }
方法一:DOM实现 //先获取该表格的引用: var Container = document.getElementById(TableId); //然后创建行(TR对象) var NewTr = document.createElement("tr"); //填充该表格行 var NewTd1 = document.createElement("td"); var NewTd2 = document.createElement("td"); ...... NewTr.appendChild(NewTd1); NewTr.appendChild(NewTd2); ...... 下面要做的是继续填充新建好的单元格 另外一种填充表格行的方式是 NewTr.innerHTML = " ........ "; 接下来,要在DOM树中指定NewTr的父节点, 在表格的DOM中,TR的父结点应该是TBODY这个几乎被遗忘的对象. var LastTr = Container.rows[Container.rows.length - 1]; LastTr.parentNode.appendChild(NewTr); 通常来讲,从表格中删除某一行一般是通过表格的deleteRow()方法和行的rowIndex属性来删除,如下,欲删除刚刚添加的新行: var Container = document.getElementById(TableId); var LastTrIndex = Container.rows.length - 1; // 表格最后一行 Container.deleteRow(LastTrIndex);