为何获取到相同的offsetLeft值？如何在设置absolute前获取元素位置？

1. 为何先打印offsetLeft再设置absolute，结果值相同？ #

当你给元素设置position: absolute但未指定left/top这类偏移属性时，元素会保持静态位置——也就是它在文档流里原本的位置。这时候哪怕元素脱离了文档流，offsetParent（计算偏移的参照父元素）可能从原来的父元素变成<body>或最近的定位祖先，但最终算出来的offsetLeft数值和定位前刚好一致：
举个例子，如果父元素没有定位且自身相对于<body>的偏移是0，元素在父元素里的offsetLeft是100px——定位前元素的offsetLeft是100px；定位后offsetParent变成<body>，元素因静态位置停在原地，它相对于<body>的偏移还是100px，所以两次获取的结果自然相同。

另外浏览器的渲染优化机制也有影响：在同一个JS任务里，修改样式后访问offsetLeft这类需要布局计算的属性时，浏览器会立即应用样式并触发重排，但因为静态位置的存在，数值不会变化。

2. 能否不设置定位就获取每个元素的offsetLeft？ #

当然可以。offsetLeft的设计初衷就是获取元素相对于其offsetParent的左侧偏移量，和元素自身的定位方式完全无关——不管元素是默认的static、relative还是其他定位，只要元素不是display: none，都能正常拿到offsetLeft的值。

3. 定位代码在打印之后执行，为何无法获取定位前的元素位置？ #

其实你第一次打印的就是定位前的位置，问题出在定位后的数值和定位前一致，让你误以为没拿到正确的前置值。原因还是上面说的静态位置：没设置left/top的absolute元素会留在原来的文档流位置，所以offsetLeft数值不变。如果想看到定位后的差异，手动给元素设置left/top值，让它脱离静态位置，此时再获取offsetLeft就会看到变化了。

内容的提问来源于stack exchange，提问作者init