本文介绍如何利用 offsetTop 和 offsetLeft 属性计算元素在屏幕上的绝对坐标。通过遍历 offsetParent 链并累加偏移量，实现 findPos 函数。代码展示了使用赋值运算符替代比较运算符的循环技巧，以准确获取元素相对于视口的最终位置。
offset 属性与坐标计算原理
offset
在所有浏览器中，元素的 offsetTop 和 offsetLeft 属性都非常实用，它们提供了元素相对于其父元素的坐标位置信息。
该机制会向上遍历 offsetParent 链，累加 offsetTop 和 offsetLeft 的值。无论 offsetParent 位于何处，最终都能计算出元素在屏幕上的真实坐标。
原理解释
这段代码逻辑非常直观。首先传入需要计算坐标的目标元素，并初始化变量 curleft 和 curtop 为 0。
findPos 函数实现与技巧
代码如下:
function findPos(obj) {
var curleft = curtop = 0;若浏览器支持 offsetParent 属性，则执行以下逻辑：
代码如下:
if (obj.offsetParent) {每当找到一个新的父级对象时，将其 offsetTop 和 offsetLeft 累加到 curtop 和 curleft 中：
代码如下:
do {
curleft += obj.offsetLeft;
curtop += obj.offsetTop;技巧：利用赋值运算符返回值
以下是该技巧的具体实现：
代码如下:
} while (obj = obj.offsetParent);这并非表达式错误。此处不使用 '==' 比较 obj 和 obj.offsetParent（因为元素与其父元素必然不相等，比较无意义）。
而是使用 '=' 将 obj.offsetParent 的值赋给 obj。关于此技巧的详细解释，可参考相关技术文档。
简单的返回逻辑
当元素不再拥有 offsetParent 时，循环结束。只要 offsetParent 存在，就会继续将 offsetLeft 加到 curleft，将 offsetTop 加到 curtop。
循环结束后，将计算得到的坐标返回给调用该函数的程序。
代码如下:
return [curleft,curtop];}翻译地址：http://www.quirksmode.org/js/findpos.html
转载请保留以下信息
作者：北玉(tw:@rehawk)