JS动态操作表格

来源：互联网发布：java socket 绑定ip 编辑：程序博客网时间：2024/04/28 08:12

所说下个项目又要做前台了，好久没有写js了，正好这几天有空，顺手写了这个使用js操作表格，就是动态给表格增加一行或删除一行。本文的代码很简单，与大家分享一下！

     //获取一个0-100随机数年龄    function getAge()    {    return Math.floor( Math.random()*100);    }            //添加一行    function add()    {    var oTr =document.getElementById("member").insertRow();    oTr.name = "oTr";    var aText = new Array();    aText[0]=document.createTextNode("andy");    aText[1]=document.createTextNode(getAge());    aText[2]=document.createTextNode("sz");    aText[3]=document.createTextNode("1300");        for(var i=0;i<aText.length;i++)    {      //增加一个单元格      var oTd=oTr.insertCell(i);            //追加文本      oTd.appendChild(aText[i]);    }    }        //删除一行    function del()    {             var oTd =document.getElementsByTagName("td");       if(oTd.length<=0)       {         alert("已经全部牺牲了！");         return ;       }       //删除行索引为1的一行              var oTr =document.getElementById("member").deleteRow(1);    }    </script>

   <center>    <table id="member" border="1" width="180">      <tr>        <th>Name</th>        <th>Age</th>        <th>Addr</th>        <th>Tel</th>      </tr>    </table>    <input type="button" value="增加一行" onClick="add()">    <input type="button" value="删除一行" onClick="del()">    </center>