添加/刪除圖片
阿新 • • 發佈：2017-06-18
logs charset eat ech 創建 button text 瀏覽器 引用
1 <!DOCTYPE html> 2 <html> 3 <head lang="en"> 4 <meta charset="UTF-8"> 5 <title>js練習 js是腳本語言直接運行在瀏覽器上的。</title> 6 <script type="text/javascript"> 7 function addpic(){ 8 //第一步創建一個dom元素 9 var imgdom=document.createElement("img");10 //第二步引用方法 11 imgdom.setAttribute("src","pic/star-on.png"); 12 //把元素節點的值給她 13 document.getElementById("div1").appendChild(imgdom); 14 } 15 function removeit(){ 16 //先獲取元素 17 var imgdom=document.getElementById("div1"); 18 //再獲取元素下的所有節點 19 var childs=imgdom.children; 20 //因為是數組再遍歷這個數組,然後再刪除他 21 for(var i=0;i<childs.length;i++){ 22 imgdom.removeChild(childs[i]); 23 } 24 } 25 </script> 26 </head> 27 <body> 28 <div id="div1"> 2930 </div> 31 <input type="button" value="添加" onclick="addpic()"> 32 <input type="button" value="刪除" onclick="removeit();"> 33 </body> 34 </html>
添加/刪除圖片