1、拖动后记录x,y值
给div加上mousePosition事件
function mousePosition(evt){
evt = evt || windowevent;
return {
x : evtclientX + documentbodyscrollLeft - documentbodyclientLeft,
y : evtclientY + documentbodyscrollTop - documentbodyclientTop
}
}
2、打开页面div定位
$(“div”)attr("top",y)attr("left",x);
扩展资料
在用js获取元素的位置之前，元素在页面的位置的计算公式，如下：
元素在页面的位置=此元素相对浏览器视窗的位置+浏览器滚动条的值；
用getBoundingClientRect()方法来获得某个元素相对浏览器视窗的位置 ｛这个方法返回的是一个对象，即Object，该对象具有4个属性：top，left，right，bottom ｝。
<html >
<head>
<meta >
<title>Demo</title>
</head>
<body style="width:2000px; height:1000px;">
<div id="demo" style="position:absolute; left:518px; right:100px; width:500px; height:500px;
background:#CC0000; top: 114px;">Demo为了方便就直接用绝对定位的元素</div>
</body>
</html>
<script>
documentgetElementById('demo')onclick=function (){
if (documentdocumentElementgetBoundingClientRect) {
alert("left:"+thisgetBoundingClientRect()left)
alert("top:"+thisgetBoundingClientRect()top)
alert("right:"+thisgetBoundingClientRect()right)
alert("bottom:"+thisgetBoundingClientRect()bottom)
var X= thisgetBoundingClientRect()left+documentdocumentElementscrollLeft;
var Y = thisgetBoundingClientRect()top+documentdocumentElementscrollTop;
alert("Demo的位置是X:"+X+";Y:"+Y)
}
}
</script>
1、通过元素的ID去拿元素，获取的是一个指定的元素（getElementById）。
2、通过元素的类名（class名）获取元素，获取的是一组元素集合（getElementsByClassName）。
3、通过元素的标签名获取（tagName），获取元素跟类名获取的一样，都是一组元素集合（getElementsByTagName）。
4、通过name属性（getElementsByName）。
5获取html的方法（documentdocumentElement）。
6获取body的方法（documentbody）。
7通过选择器获取一个元素（querySelector）。8通过选择器获取一组元素（querySelectorAll）。元素，现代数学集合论中，元素是组成集的每个对象，集合由元素组成，组成集合的每个对象也称为元素。
js获取数组中的一部分元素，有2种方法：slice和filter函数，下面分别介绍。
sliceslice的定义和用法如下，用于截取数组的一段
执行
var arr = [1,2,3,4,5];
arrslice(1,4);
这2行代码，可以看到截取了1到4下标的代码
filterfilter则用于过滤数组中的一部分元素，剩下的元素就是需要的那部分元素。
现在尝试下面代码，可以将一个数字数组中的偶数过滤掉，只留下奇数。
var arr = [1,2,3,4,5];
arrfilter(e=>e%2==0)
以上就是关于js获取div到body左侧距离全部的内容，包括:js获取div到body左侧距离、js获取不含指定类名的元素、JS中如何获取数组中的一部分元素等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）