javascript - javascriptでhtml要素のx、y位置を取得する方法

Question

私のhtmlドキュメントには特定のcssクラスを持ついくつかのdiv要素があり、事前に感謝して、それらの要素のx、y位置を取得したいと思います。

Answer 1

使用getBoundingClientRect: http://ejohn.org/blog/getboundingclientrect-is-awesome/

例えば：

var div = document.getElementById("yourDiv");
var rect = div.getBoundingClientRect();
alert("Coordinates: " + rect.left + "px, " + rect.top + "px");

は現在の viewport を基準としgetBoundingClientRectた座標を与えることを思い出してください。つまり、 を基準とした座標を知りたい場合は、水平スクロール量と垂直スクロール量を追加する必要があります (またはFirefox の場合はもちろん)。document.bodydocument.documentElement.scrollLeftdocument.body.scrollLeft.scrollTop

Answer 2

以下の例は、HTML 要素の ClientRect を取得する方法を示しています。

# first tag link of this page
document.getElementsByClassName('post-taglist')[0].children[0].getClientRects()[0]
# question div
document.getElementById('question').getClientRects()[0]

それを使用すると、右、上、高さ、幅、左、および下の属性にアクセスできます。

Answer 3

私が理解しているなら、あなたはこれをしたいhttp://www.quirksmode.org/js/findpos.html