js的node物件(節點的使用)
阿新 • • 發佈:2019-01-09
<!DOCTYPE html>
<html><head>
<meta charset="UTF-8">
<title></title>
<script>
function copy1(){
var i1=document.getElementById("i1");
var node1=i1.cloneNode(i1);
i1.parentNode.appendChild(node1);
}
function add1(){
var i1=document.getElementById("i1");
var newnode=document.createElement("img");
newnode.src="img/1.jpg";
i1.parentNode.insertBefore(newnode,i1);
}
function remove1(){
var i1=document.getElementById("i1");
i1.parentNode.removeChild(i1);
}
function replace1(){
var i1=document.getElementById("i1");
var newnode=document.createElement("img");
newnode.src="img/1.jpg";
i1.parentNode.replaceChild(newnode,i1);
}
</script>
</head>
<body>
<img id="i1" src="img/8.jpg" width="200px" height="300px"/>
<input id="i6" type="button" value="複製圖片" onclick="copy1()"/>
<input id="i3" type="button" value="新增圖片" onclick="add1()"/>
<input id="i4" type="button" value="刪除圖片" onclick="remove1()"/>
<input id="i5" type="button" value="替換圖片" onclick="replace1())"/>
</body>
</html>