邮箱中邮件，博客园中的博客都有类似的行为
<!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>
window.onload=function ()
{
var oUl=document.getElementById("ul1");
var oTxt=document.getElementById(‘txt1‘);
var oBtn=document.getElementById(‘btn2‘);
oBtn.onclick=function ()
{
var oLi=document.createElement(‘li‘);
var aLi=oUl.getElementsByTagName(‘li‘);
oLi.innerHTML=oTxt.value+‘<a href="javaScript:;" >删除</a>‘;//将框中的内容添加到插入的li标签中，在添加一个删除链接
//将oLi添加到oUl标签中
if(aLi.length==0){
oUl.appendChild(oLi);//如果是第一个li标记，直接添加
}else
{
oUl.insertBefore(oLi,aLi[0]);//如果已经有li标记，在第一个位置插入
}
var aA=oUl.getElementsByTagName(‘a‘);//得到a标签
for(var i=0;i<aA.length;i++)//对每个a标记进行操作
{
aA[i].onclick=function ()//对每个a标记创建单击事件
{
oUl.removeChild(this.parentNode);//当点击删除时，删除父节点
}
}
}
}
</script>
</head>
<body>
<input id="txt1" type="text" />
<input id="btn2"type="button" value="创建"/>
<ul id="ul1">
</ul>
</body>
</html>
时间： 2024-07-30 16:07:02