本帖最后由 u014067261 于 2014-11-06 20:22:23 编辑

解决方案 »

  1.   


    <!DOCTYPE html>
    <html>
     <head>
      <title> new document </title>
      <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
      <script type="text/javascript">
          window.onload = function(){
               var trs = document.getElementsByTagName('tr');
               for(var i = 1; i < trs.length; i++){
                    trs[i].onmouseover = function(){
                         this.style.backgroundColor = "#f2f2f2";
                    }
                    trs[i].onmouseout = function(){
                         this.style.backgroundColor = "#fff";
                    }
              }
            }     function addTo(){
               var table = document.getElementById('table');
               var tr = document.createElement('tr');           var td = document.createElement('td');
               td.innerHTML="<input type = 'text' />";
               tr.appendChild(td);           td = document.createElement('td');
               td.innerHTML="<input type = 'text' />";
               tr.appendChild(td);           td = document.createElement('td');
               td.innerHTML="<a href='#' onclick='deleteItem(this);return false;'>删除</a>";
               tr.appendChild(td);           table.appendChild(tr);
              }      function deleteItem(obj){ 
    obj.parentNode.parentNode.parentNode.removeChild(obj.parentNode.parentNode);
          }
      </script>
     </head>
     <body>
         <table border="1" width="50%" id="table">
         <tr>
        <th>工号</th>
        <th>姓名</th>
        <th>选项</th>
         </tr>    <tr>
        <td>01</td>
        <td>小明</td>
        <td><a href='#' onclick='deleteItem(this);return false;' >删除</a></td>   
         </tr>     <tr>
        <td>02</td>
        <td>小王</td>
        <td><a href='#' onclick='deleteItem(this);return false;' >删除</a></td> 
         </tr>     </table>
         <input type="button" value="添加一行"  onclick = "addTo();"/>   
     </body>
    </html>