表格对象的获取和更改(原生js)
表格对象的获取
var oT = document.getElementById("tb"); //获取head console.log(oT.tHead); console.log(typeof oT.tHead); //获取body console.log(oT.tBodies);//[tbody] console.log(typeof oT.tBodies); //获取foot console.log(oT.tFoot); //获取行[tr,tr...] console.log(oT.rows); //修改第三行的颜色 oT.rows[2].style.background="blue"; //获取单元格(不能直接通过表格对象获取,通过行获取单元格) // console.log(oT.cells);//undefined var rows = oT.rows;//[tr,tr...] var cells=rows[rows.length-1].cells; console.log(cells);//[td,td,td,td] cells[cells.length-1].style.background="red";
表格元素的修改
var oT = document.getElementById("tb"); //插入行 //参数:下标 var newRow=oT.insertRow(1); // console.log(newRow); // newRow.innerHTML="new insertRow"; //在行中插入单元格 var newTd=newRow.insertCell(0); newTd.innerHTML = "小明"; // console.log(newTd); newRow.insertCell(1).innerHTML="18"; newRow.insertCell(2).innerHTML="男"; newRow.insertCell(3).innerHTML="工程师";
欢迎一起讨论,共同进步