增加和删除

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>无标题文档</title>

<script>

  function add()

  {

      var table=document.getElementById('mytable');

  var tr=document.createElement('tr');

  

  var td1=document.createElement('td');

  var myfile=document.createElement('input');

  myfile.type="file";

  td1.appendChild(myfile);

  

  var td2=document.createElement('td');

  var addbut=document.createElement('input');

  addbut.type="button";

  addbut.value="添加";

  addbut.onclick=add;

  

  var deletebut=document.createElement('input');

  deletebut.type="button";

  deletebut.value="删除";

  /*deletebut.onclick=function()

  {

    table.removeChild(tr);

      }*/

  deletebut.onclick=function()

  {

    deletes(tr,table);

      }

  td2.appendChild(addbut);

  td2.appendChild(deletebut);

  

  tr.appendChild(td1);

  tr.appendChild(td2);

  table.appendChild(tr);

  }

  

  function deletes(tr,table)

  {

      table.removeChild(tr);

  }

</script>

</head>

<body>

推荐网站 www.w3cschool.com

<table border="1" >

  <tbody id="mytable">

  <tr>

    <td width="300"><input name="" type="file" /> </td>

    <td width="150"><input name="" type="button" value="添加" onclick="add()"/> </td>

  </tr>

</tbody>

</table>

</body>

</html>