Javascript修改表格记录

来源:互联网 发布:源码翻译 编辑:程序博客网 时间:2024/05/22 05:21
<html>  <head>    <script type="text/javascript">            function Insert()      {        var row=document.getElementById("mytable").insertRow(-1);        var col1=row.insertCell(0);        var col2=row.insertCell(1);        col1.innerHTML=document.getElementById("name").value;        col2.innerHTML=document.getElementById("job").value;      }     function edit(oldstring,newstring)      {        var table=document.getElementById("mytable");        //document.write(table.rows.length);        var temp=0;        for(var i=1;i<table.rows.length;++i)        {          if(table.rows[i].cells[0].innerHTML==oldstring)          {            table.rows[i].cells[1].innerHTML=newstring;          }        }        //document.write(temp);              }    </script>        <style type="text/css">      #mytable td      {        width:100px;      }      tr.col_header      {        background-color:grey;      }    </style>  </head>    <body>    <div>      姓名<input type="text" id="name"></input>    </div>    <div>      职业<input type="text" id="job"></input>    </div> <input type="button" value="添加" onclick="Insert()">        <table id="mytable">    <tr class="col_header"><td>姓名</td><td>职业</td></tr>    </table> <div>  <div>  姓名<input type="text" id="oldstring">  </div>  <div>    职业<input type="text" id="newstring">  </div>    <input type="button" value="修改" onclick="edit(oldstring.value,newstring.value)"></div>  </body>  </html>

原创粉丝点击