DOM ツリーのさまざまなレベルで Web ページの 2 つのセグメント間の距離を計算できるように、Web ページを視覚的にセグメント化する必要があるタスクがあります。簡単な方法で、画面上のページの表示を囲むボックスを取得できるようにしたいと考えています。たとえば、次の画像を考えてみましょう: DOM 構造を表示する画像
これは Chrome を使用して描画しました。Chrome は、各 DOM ノードに対応する長方形をブラウザーのページの表示に提供します。画面にどのように表示されるかに基づいてページを処理できるように、プログラムでこれらのボックスを取得するにはどうすればよいですか。