5

特定の場所 (ビューポートに対する x、y など) の下にある html 要素のリストを繰り返し取得する必要があるアプリを構築しています。次のアプローチを検討していますが、満足できるものはありません。

(1)htmlを調べて、すべての要素のx、y位置を追跡するデータ構造を構築し(x、y - >要素のセット)、ルックアップが必要なときにこのデータ構造にアクセスします. 残念ながら、このアプローチは少し面倒なので、この問題を解決するためのより良い方法を探しています。さらに、遅すぎるのではないかと心配しています。

(2) 私が検討しているおそらくより良いアプローチは、すべてのホバー イベントをキャプチャするトップレベルのイベント ハンドラーを一時的に追加し、特定の位置でのマウス ホバーを偽造してから、ハンドラーを削除することですが、これは最上位の要素のみを返します (たとえば、特定の場所に絶対位置の div がたくさんある場合、z-index が最も高いものだけが返されると思いますが、すべてが必要ですが、よくわかりません) )。

(3) IE の場合、componentFromPoint(x, y) がありますが、他のブラウザーで同等のものを見つけることができません。これは、最上位の要素のみを返します。

アプリはブックマークレットとして構築されており、基になる html を制御できないことに注意してください。残念ながら、これにより簡単なサーバー側のソリューションが削減されます。

私はライブラリを使用したいと思っています (現在は jquery を使用しています)。

参考までに、これまでのところ、ここで見つけた最高のものはGet DIV id based on x & y positionです。もっと最新のものがあるかどうか疑問に思っています。

4

1 に答える 1

1

elementFromPointMSIE、FF3+、および Safari と Opera の何らかの形で存在するメソッドを探しているかもしれません。も一見の価値があるかもしれませんgetBoundingClientRect。2つを組み合わせると、ビジネスになるはずです。

ルックアップ間で計算された構造を保持し、ページで実際に変更が発生したときにのみ再計算することで、アプローチ 1 を高速化することもできます。セレクター エンジン (特に Sizzle) がルックアップをキャッシュし、DOM が変更されたときにキャッシュを期限切れにする方法を見てみましょう。

不自然に思えるかもしれませんが、すべての要素の位置を計算することは、これまでドラッグ アンド ドロップ ハンドラーが行ってきたことです。この機能が適切に最適化された無料のものはたくさんあります (私の推測では、YUI のコードが最も読みやすいコードになると思います)。ただし、これらは時代遅れであるか、または必要のないブラウザーをサポートしようとしている可能性があります。

于 2009-08-15T00:52:05.483 に答える