Q

指定された位置に要素を取得する - JavaScript

2009-08-11 19 views 107 likes

107

JavaScriptを使用する指定された位置で要素を識別するにはどうすればよいですか？基本的には、2つの入力パラメータ（x座標とy座標）をとり、パラメータで表される画面上の位置にhtml要素を返す関数を記述したいと考えています。指定された位置に要素を取得する - JavaScript

2009-08-11 kjv

+0

[elementsFromPoint]（https://developer.mozilla.org/en-US/docs/Web/API/Document/elementsFromPoint） –

A

答えて

197

document.elementFromPoint(x, y);

http://dev.w3.org/csswg/cssom-view/#dom-document-elementfrompoint

http://msdn.microsoft.com/en-us/library/ms536417%28VS.85%29.aspx

https://developer.mozilla.org/en/DOM/document.elementFromPoint

2009-08-11 10:53:17 rahul

+10

要素が重複している場合にのみ、 'document.elementsFromPoint'も存在します。 – Seiyria

+1

私はこれが5.5で働いていることに驚いています。今日はあまり使われていません。 –

+0

私はこの方法を試して、文書に従って位置を測定します。親要素との相対的な使い方は？ – Charas

24

あなたは、ビューポートのY、座標xにある要素を返し、ネイティブのJavaScript elementFromPoint(x, y)方法を使用することができます。

elementFromPoint w3c draft

そして、コードサンプルを参照してください。

<html> 
<head> 
<title>elementFromPoint example</title> 

<script type="text/javascript"> 

function changeColor(newColor) 
{ 
elem = document.elementFromPoint(2, 2); 
elem.style.color = newColor; 
} 
</script> 
</head> 

<body> 
<p id="para1">Some text here</p> 
<button onclick="changeColor('blue');">blue</button> 
<button onclick="changeColor('red');">red</button> 
</body> 
</html>

あなたが継続的要素のホバーイベントをチェックするためにsetInterval()を使用しますが、それはお勧めできません、強化する代わりに.hover(...)とCSSを使用しようとすることができアプリケーションのパフォーマンス。

2011-07-11 16:49:18

関連する問題