- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
- <title>Add&DeleteNodetitle>
- <script language="javascript">
- var i=1;
- function insertStr() {
- i++;
- var td = document.createElement("td");
- var tr = document.createElement("tr");
- var tbody = document.createElement("tbody");
- tr.appendChild(td);
- tbody.appendChild(tr);
- var parNode = document.getElementById("table1");
- parNode.appendChild(tbody);
- tr.setAttribute("name","tr"+i);
- tr.setAttribute("id","tr"+i);
- td.innerHTML="<input type='text' name='Tag"+i+"' id='Tag"+i+"' value='Tag"+i+"'><input type='button' value='Delete' name='Delete"+i+"' id='Delete"+i+"' onClick='javascript:DeleteNode("+i+")'>";
- document.form1.total.value=i;
- }
- function DeleteNode(j)
- {
- var trnode=document.getElementById("tr"+j);
- trnode.parentNode.removeChild(trnode);
- }
- script>
- head>
- <body>
- <form name="form1" method="post" action="">
- <input name="tag1" type="text" id="tag1" value="Tag1">
- <input name="insert" type="button" id="insert" value="Add a Tag" onClick="insertStr()">
- <input type="hidden" name="total" id="total">
- form>
- <table width="400" border="1" cellspacing="0" cellpadding="0" id="table1">
- table>
- body>
- html>
代码中红色的部分就是可以在table的元素中添加控件的方法 ~ 注意联系牢牢掌握哦~
因为用了元素的innerHTML的属性,所以可以在后面之间添加控件