Range.getBoundingClientRect()

The Range.getBoundingClientRect() method returns a DOMRect object that bounds the contents of the range; this a rectangle enclosing the union of the bounding rectangles for all the elements in the range.

This method is useful for determining the viewport coordinates of the cursor or selection inside a text box. See Element.getBoundingClientRect() for the details on the returned value.

Syntax

boundingRect = range.getBoundingClientRect()

Example

range = document.createRange();
range.selectNode(document.getElementsByTagName("div").item(0));
rect = range.getBoundingClientRect();

Specification

Browser compatibility

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

See also

• Range.getClientRects() - finer-grained result for non-rectangular ranges (e.g. when the selection wraps onto the next line);
• Element.getBoundingClientRect()
• Document.caretPositionFromPoint() - to get the (node, offset) from viewport coordinates.