js 如何动态改变div的位置

最新推荐文章于 2021-06-04 06:01:31 发布

zmbc48

最新推荐文章于 2021-06-04 06:01:31 发布

阅读量3.7w

点赞数

分类专栏： java

本文链接：https://blog.csdn.net/zmbc48/article/details/8525918

版权

java 专栏收录该内容

12 篇文章 0 订阅

订阅专栏

在一个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>