【转】style.left 与 offsetLeft

首先假设有一个元素是这样的<input id="message" value="123" /> var elem = document.getElementById("message"),此时elem得到的就是这个元素了.
通过访问elem.id,我们能获得elem的id,elem.value我们能得到123.注意这里的id以及value都是直接写在标签中的.我的意思就是,这样的访问是只能访问标签的属性,也就是直接写在标签里的属性.而你的代码中,elem.style.left想要获取elem的left值是获取不到的,因为left的定义是写在样式表中而不是标签内的.

因此,你可以把标签改为

<p id="message" style="left:20px;top:302px;">weel</p>
或者用js代码给message初始赋值:

document.getElementById('message').style.left = "20px";
document.getElementById('message').style.top = "302px";

-----------------------------------------------------

有时候碰到一个问题，通过div的style.left属性取不到值，拖动div后可以取到值。

    如果父div的position定义为relative,子div的position定义为absolute，那么子div的style.left的值是相对于父div的值，这同offsetLeft是相同的，区别在于：

1. style.left 返回的是字符串，如28px，offsetLeft返回的是数值28，如果需要对取得的值进行计算，还用offsetLeft比较方便。

2. style.left是读写的，offsetLeft是只读的，所以要改变div的位置，只能修改style.left。

3. style.left的值需要事先定义，否则取到的值为空。而且必须要定义在html里，我做过试验，如果定义在css里，style.left的值仍然 为空，这就是我刚开始碰到的问题，总是取不到style.left的值。offsetLeft则仍然能够取到，无需事先定义div的位置。

----------------------------------

http://www.17leba.com/%E7%94%A8js%E6%97%A0%E6%B3%95%E8%8E%B7%E5%8F%96style%E6%A0%B7%E5%BC%8F%E7%9A%84%E9%97%AE%E9%A2%98%E8%A7%A3%E6%9E%90%E4%B8%8E%E8%A7%A3%E5%86%B3%E6%96%B9%E6%B3%95/