DOM对table进行操作-优快云博客

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> 动态表单操作 </TITLE>
<script>
   function add(){
	   var tbody =  document.getElementById("tbody");
	   var rowNo = tbody.rows.length;
	   tbody.insertRow(rowNo);
	   tbody.rows[rowNo].insertCell(0);
	   tbody.rows[rowNo].cells[0].innerText="0001";//innerText 和innerHTML
	   tbody.rows[rowNo].insertCell(1);
	   tbody.rows[rowNo].cells[1].appendChild(document.createTextNode("计软0407"));
	   tbody.rows[rowNo].insertCell(2);
	   tbody.rows[rowNo].cells[2].appendChild(document.createTextNode("周帅"+rowNo));
	   tbody.rows[rowNo].insertCell(3);
	   var button = document.createElement("input");
	   button.type="button";
	   button.value="删除";
	   button.οnclick="javascript:alert(0)";//不知道为啥不可以
	   tbody.rows[rowNo].cells[3].innerHTML="<input type='button' value='删除' οnclick='deleteRow()'/>";
	   
   }
   function deleteRow(){
		var rowNo = window.event.srcElement.parentElement.parentElement.rowIndex;
		var tbody =  document.getElementById("tbody");
		tbody.deleteRow(rowNo);
   }
</script>
</HEAD>

<BODY>
<TABLE border="1">
  <tbody id="tbody">
      <tr>
		<td>学号</td>
		<td>班级</td>
		<td>姓名</td>
		<td>操作</td>
	  </tr>
  </tbody>
</table>
<button οnclick="add()" value="添加">添加</button>
</BODY>
</HTML>