9261


HTML要素のoffsetLeftプロパティは、親要素マージン有無に影響を受けるでしょうか？  
・その際、positionプロパティも関係する？

また、jQueryのoffsetメソッドをJavaScriptだけで書くにはどうすれば良いでしょうか？


CC BY-SA 3.0
2015-04-17T03:13:58.350
9245
2015-04-18T12:24:48.420
7886
question
javascript jquery
jQueryのoffsetメソッドをJavaScriptだけで書くには？


DOMの
[`offsetLeft`](https://developer.mozilla.org/ja/docs/Web/API/HTMLElement/offsetLeft)
は、親側の要素のborderの内側から子側要素のborderの外側までを返すようです。よって親要素のマージンに影響を受けることはないかと思います。

  * [Measuring Element Dimension and Location with CSSOM in Windows Internet Explorer 9](https://msdn.microsoft.com/en-us/library/hh781509\(v=vs.85\).aspx)
  * [CSSOM View Module](http://dev.w3.org/csswg/cssom-view/#dom-htmlelement-offsetleft) （Working Draft）
  * [offsetTop/offsetLeft/offsetParentの闇 - Backstage of theater.js](http://d.hatena.ne.jp/susie-t/20061004/1159942798#200610041723)

ただし現時点では Working Draft
レベルまでしか標準化が進んでおらず、上記3番目の記事によれば少なくとも古いブラウザでは挙動に違いがあるようです。

> また、jQueryのoffsetメソッドをJavaScriptだけで書くにはどうすれば良いでしょうか？

まさにそれがJavascriptで書かれているわけですから、ソースを読んでみてはいかがでしょう。

<https://github.com/jquery/jquery/blob/master/src/offset.js>

なお[jQueryの `offset()`](http://api.jquery.com/offset/)
はドキュメントに対する座標を取得しますが、DOMの
[`offsetLeft`](https://developer.mozilla.org/ja/docs/Web/API/HTMLElement/offsetLeft)
は `offsetParent` に対する座標なので、挙動が異なります。


CC BY-SA 3.0
2015-04-17T09:49:07.273
9261
2015-04-17T09:49:07.273
8000
9245
answer


「また」以降の質問は、こういうことが知りたいのかな？

[code]

    .position({top: 100, left: 100});
    
[/code]


CC BY-SA 3.0
2015-04-18T12:24:48.420
9288
2015-04-18T12:24:48.420
8505
9245
answer