JavaScript创建和删除元素源码下载

实际应用中，往往需要动态的创建和删除指定的元素。

下面通过代码实例介绍一下如何实现此功能。

[ 其他 ] 运行代码下载代码

<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="https://www.51qianduan.com/" />
<title>51前端</title>
<style type="text/css">
#thediv{
  width:200px;
  height:300px;
  border:1px solid green;
}
</style>
<script type = "text/javascript"> 
function creat(){ 
  var linkElement=document.createElement("a");
  linkElement.href="https://www.51qianduan.com"; 
  linkElement.innerHTML="51前端"; 
  linkElement.id="theid";
  var odiv=document.getElementById("thediv");
  odiv.appendChild(linkElement); 
} 
function del(){ 
  var odiv=document.getElementById("thediv");
  odiv.removeChild(document.getElementById("theid")); 
} 
window.onload=function(){
  var creatBt=document.getElementById("creatBt");
  var deBt=document.getElementById("deBt");
  creatBt.onclick=function(){creat()}
  deBt.onclick=function(){del()}
}
</script> 
</head>
<body> 
<input type="button" id="creatBt" value="动态的创建一个超链接"/> 
<input type="button" id="deBt" value="动态的删除添加的元素"/> 
<div id="thediv"></div> 
</body> 
</html>

代码描述：JavaScript创建和删除元素。JavaScript创建和删除元素源码下载

下载全部收藏

134 179

用户评论

大牛，别默默的看了，快登录帮我点评一下吧！:) 登录 | 注册