javascript如何動態新增和刪除元素

admin發表於2017-02-28
JavaScript
在實際應用中，可能需要動態的新增或者刪除元素，下面就簡單介紹一下如何實現此操作。

一.新增元素:

[HTML] 純文字檢視 複製程式碼
<script type="text/javascript">
var mylink=document.createElement("a");
mylink.id="thelink";
mylink.innerHTML="螞蟻部落";
mylink.href="http://www.softwhy.com";
window.onload=function(){
  var mydiv=document.getElementById("mydiv");
  mydiv.appendChild(mylink);
}
</script>
</head>
<body>
  <div id="mydiv"></div>
</body>
</html>

以上程式碼可以建立一個超連結，並且新增到div中去。

二.刪除元素:

[HTML] 純文字檢視 複製程式碼
<script type="text/javascript">
window.onload=function(){
  var main=document.getElementById("main");
  var second=document.getElementById("second");
  main.removeChild(second);
}
</script>
</head>
<body>
<div id="main">
 <div id="mydiv">螞蟻部落一</div>
 <div id="second">螞蟻部落二</div>
</div>
</body>
</html>

以上兩段程式碼大體演示瞭如何新增和刪除元素，希望能夠給大家帶來幫助。

相關文章