DOMRectList: length プロパティ
Baseline
広く利用可能
この機能は広く実装されており、多くのバージョンの端末やブラウザーで動作します。2020年1月以降、すべてのブラウザーで利用可能です。
length は DOMRectList インターフェイスの読み取り専用プロパティで、リスト内の DOMRect オブジェクトの数を返します。
値
DOMRectList 内の DOMRect オブジェクトの数を表す正の整数。リスト内に長方形がない場合、 length は 0 になります。
例
次の例では、 <div> 要素の長方形のリストを Element.getClientRects() で取得します。次に、ページ内の別の <div> 要素内に、リスト内の長方形の数を表示します。
まず、 HTML です。
html
<div id="box" style="width: 50px; height: 20px; border: 1px solid black;"></div>
<div id="output"></div>
そして JavaScript です。
js
const box = document.getElementById("box");
const rects = box.getClientRects();
const output = document.getElementById("output");
output.textContent = `長方形の数: ${rects.length}`;
出力は次のようなります。
仕様書
| 仕様書 |
|---|
| Geometry Interfaces Module Level 1 # dom-domrectlist-length |