js 如何動態改變div的位置
在一個div中動態建立一個div，要取得這個div相對於父視窗的位置，我開始以為appendChild就是子div，取得這個子物件就是我想要的位置，但是不是這樣的，它的位置還是相對document的。所以我做了一個實驗：通過取得子視窗的位置減去父視窗的位置就可以了。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<HEAD>
<title> New Document </title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<SCRIPT>
function fun(){
//alert(father.offsetTop);
//alert(father.offsetLeft)
fa.value=father.offsetTop+"--"+father.offsetLeft;
var divChild = document.createElement("Div");
divChild.id="divChild";
divChild.style.width="20px";
divChild.style.left="160px";//因為offsetLeft是隻讀屬性所以要通過left屬性設定。而且還要設定絕對定位。
divChild.style.top="180px";//
divChild.style.height="20px";//
divChild.style.position="absolute";
divChild.style.background="#ddd";
father.appendChild(divChild);
ch.value=(parseInt(divChild.offsetTop)-parseInt(father.offsetTop))+"--"+(parseInt(divChild.offsetLeft)-parseInt(father.offsetLeft));
}
</SCRIPT>
</HEAD>
<BODY >
<br /><br /><br />
父座標：<input type="text" id="fa" value="" />
子座標：<input type="text" id="ch" value="" />
<input type="button" value="add" onclick="fun()"/>
<div id="father" style="width:300px;height:300px;background:#888"></div>
<BODY>
</HTML>