javascript例子

添加用户：
<form action="" method="post">
	名字：<input type="text" name="name" id="name"/>
	<input type="button" id="addUser" value="添加"/>
</form>

<hr />

<table id="mytable" border="1" width="20%">
	<tr>
		<td>testName</td>
		<td><a href="delete?id=testName">delete</a></td>
	</tr>
</table>


<script type="text/javascript">
	
	window.onload=function(){
		document.getElementById("addUser").onclick=function(){
			
			//取得表单的name值
			var nameValue=document.getElementById("name").value;

			//创建name的td
			var nameTd=document.createElement("td");
			var nameText=document.createTextNode(nameValue);
			nameTd.appendChild(nameText);

			//创建delete的td
			var aTd=document.createElement("td");
			//创建a元素
			var aElement=document.createElement("a");
			//设置 a 元素的属性
			aElement.setAttribute("href","delete?id="+nameValue);
			//设置a元素的文本
			var deleteText=document.createTextNode("delete");
			//将delete文本追加到a元素
			aElement.appendChild(deleteText);
			//将a元素追加到aTd 
			aTd.appendChild(aElement);
			

			//创建tr
			var trElement=document.createElement("tr");
			trElement.appendChild(nameTd);
			trElement.appendChild(aTd);

			//将tr添加到表格
			var tableElement=document.getElementById("mytable");

			//这步火狐支持，IE不支持
			//tableElement.appendChild(trElement);
			
			//火狐 IE都支持
			var tbodyElement=document.createElement("tbody");
			tbodyElement.appendChild(trElement);
			tableElement.appendChild(tbodyElement);

			//编写删除事件
			aElement.onclick=function(){
				if(window.confirm("确定删除"+nameValue+"的信息吗？")){
					 tbodyElement.removeChild(trElement);
				}
				return false;
			}
		}
	}

</script>

 
 

评论

2 楼 周一Monday 2012-07-18  

aElement.onclick

Eyal 写道

这61行的aElement是什么意思？求解释

是在33行
var aElement=document.createElement("a");  
创建<a href=""></a>超链接节点用的。

1 楼 Eyal 2012-07-18  

这61行的aElement是什么意思？求解释