js如何获取某个html元素的x y坐标_框架

<!DOCTYPE html>

<head>

<title>Title</title>

</head>

<body>

<ul>

</ul>

$('ul')on('click','li',function (e) {

consolelog(eclientX);

consolelog(eclientY);

})

</script>

</body>

</html>

在 JS获取div高度的方法中，整理了几个有关于获取div高度的方法，后来又遇到一个问题，怎么获取DIV在页面中的绝对位置，因此在这篇笔记中记录一下。

页面结构

样式

getBoundingClientRect用于获取某个元素 相对于视窗 的位置集合。集合中有top, right, bottom, left等属性。

offsetLeft指的是元素相对于 版面或 由 offsetParent 属性指定的 父坐标 的计算上侧位置，整型，单位像素。

借用这个思路，当我们想获取元素的绝对位置时，可以递归遍历，直到元素的父元素为body为止。

关于offsetParent属性，有以下几点Tips。

for循环，例如

var k;

for(var i=0;i<arrayNamelength;i++){

if(k==arrayName[i]) return i;

}

呵呵，，不知道你会不会JQUERY，给你一个JQ的代码吧：

获取IMG绝对X,Y坐标，可以用offset()方法：

var X = $('#img1')offset()top;

var Y = $('#img1')offset()left;

获取相对(父元素)位置:

var X = $('#img1')position()top;

var Y = $('#img1')position()left;

以上就是关于js如何获取某个html元素的x y坐标全部的内容，包括:js如何获取某个html元素的x y坐标、原生JS获取页面中DIV绝对位置的方法、javascript如何获得数组元素当前坐标等相关内容解答，如果想了解更多相关内容，可以关注我们，你们的支持是我们更新的动力！

欢迎分享，转载请注明来源：内存溢出

js如何获取某个html元素的x y坐标