javascaript 操作 table dom

### js 操作table 对象：
?
cells 返回包含表格中所有单元格的一个数组。
rows 返回包含表格中所有行的一个数组。
tBodies 返回包含表格中所有 tbody 的一个数组。
--------------------------------------------------------------------------------------
caption 返回表格标题。 Yes
cellPadding 设置或返回单元格内容和单元格边框之间的空白量。 Yes
cellSpacing 设置或返回在表格中的单元格之间的空白量。 Yes
frame 设置或返回表格的外部边框。 Yes
height 已废弃?设置或者返回表格高度 instead D
rules 设置或返回表格的内部边框（行线）。 Yes
summary 设置或返回对表格的描述（概述）。 Yes
tFoot 返回表格的 TFoot 对象。如果不存在该元素，则为 null。 Yes
tHead 返回表格的 THead 对象。如果不存在该元素，则为 null。
------------------------------------------------------------------------------------------
createCaption() 为表格创建一个 caption 元素。 Yes
createTFoot() 在表格中创建一个空的 tFoot 元素。 Yes
createTHead() 在表格中创建一个空的 tHead 元素。 Yes
deleteCaption() 从表格删除 caption 元素以及其内容。 Yes
deleteRow() 从表格删除一行。 Yes
deleteTFoot() 从表格删除 tFoot 元素及其内容。 Yes
deleteTHead() 从表格删除 tHead 元素及其内容。 Yes
insertRow() 在表格中插入一个新行。
?

<table border='1' width="350">

			<thead>

				<tr>

					<th>#</th>

					<th>name</th>

					<th>age</th>

					<th>operation</th>

				</tr>

			</thead>

			<tbody></tbody>

		</table>

		

		

		<script>

			var oName = document.getElementById('name');

			var oAge = document.getElementById('age');

			var obtn = document.getElementById('btn');

			var oTable = document.getElementsByTagName('table')[0];

			var oid = oTable.tBodies[0].rows.length+1;

			var oTfoot = oTable.tFoot;

			

			

			obtn.onclick = function(){

			

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

				

				oTr.innerHTML = '<td>'+(oid++)+'</td><td>'+oName.value+'</td><td>'+oAge.value+'</td><td><a href="javascript:;">del</a></td>'

				

				oTable.tBodies[0].appendChild(oTr);

				

				var odel = oTr.getElementsByTagName('a')[0];

				odel.onclick = function(){

					oTable.tBodies[0].removeChild(this.parentNode.parentNode);

				};

				

			};

			

			

		</script>