range

Range表示包含节点和部分文本节点的文档片段。

Range可以用 Document 对象的 createRange方法创建，也可以用Selection对象的getRangeAt方法取得。另外，可以通过构造函数 Range() 来获得一个 Range 。

属性

Range.collapsed 只读: 返回一个用于判断 Range 起始位置和终止位置是否相同的布尔值。
Range.commonAncestorContainer 只读: 返回包含 startContainer 和 endContainer 的最深的节点。
Range.endContainer 只读: 返回包含 Range 终点的节点。
Range.endOffset 只读: 返回 endContainer 中表示Range终点位置的数字。
Range.startContainer 只读: 返回包含 Range 开始的节点。
Range.startOffset 只读: 返回 startContainer 中表示 Range 起始位置的数字。

方法

定位方法

我们没有在此列举继承方法。

Range.setStart(): 设置 Range 的起点。
Range.setEnd(): 设置 Range 的终点。
Range.setStartBefore(): 以其它节点（ Node）为基准，设置 Range 的起点。
Range.setStartAfter(): 以其它节点为基准，设置 Range 的始点。
Range.setEndBefore(): 以其它节点为基准，设置 Range 的终点。
Range.setEndAfter(): 以其它节点为基准，设置 Range 的终点。
Range.selectNode(): 设定一个包含节点和节点内容的 Range 。
Range.selectNodeContents(): 设定一个包含某个节点内容的 Range 。
Range.collapse(): 向指定端点折叠该 Range 。

编辑方法

通过以下方法，可以从 Range 中获得节点，改变 Range 的内容。

Range.cloneContents(): 返回 Range 当中节点的文档片段（DocumentFragment）。
Range.deleteContents(): 从文档（Document）中移除 Range 中的内容。
Range.extractContents(): 把 Range 的内容从文档树移动到文档片段中。
Range.insertNode(): 在 Range 的起点处插入节点。
Range.surroundContents(): 将 Range 的内容移动到一个新的节点中。

其他方法

Range.compareBoundaryPoints(): 比较两个 Range 的端点。
Range.cloneRange(): 返回拥有和原 Range 相同端点的克隆 Range 对象。
Range.detach(): 从使用状态释放 Range，此方法用于改善性能。
Range.toString(): 把Range内容作为字符串返回。

Gecko 方法

在这里解释Mozilla独有的，在W3C DOM标准里没有的 Range方法。

Range.compareNode(): 返回常量，表示node是否在range的前、后、中、外。
Range.comparePoint(): 返回-1、0、1，分别表示指定点在range的前、中、后。
Range.createContextualFragment(): 解析指定字符串（XML或HTML），并返回document fragment。

Range.intersectsNode(): 返回boolean值，表示指定Node是否横断Range。
Range.isPointInRange(): 返回boolean值，表示指定点是否在range中。

Range.getBoundingClientRect(): Returns a ClientRect object which bounds the entire contents of theRange; this would be the union of all the rectangles returned by range.getClientRects().
Range.getClientRects(): Returns a list of ClientRect objects that aggregates the results of Element.getClientRects() for all the elements in the Range.

详细用法

详细用法	当前状态	注释
DOM Range	Living Standard	Do not use `RangeException`anymore, use `DOMException`instead. Made the second parameter of`collapse()` optional. Added the methods`isPointInRange()`,`comparePoint()`, and`intersectsNode()`. Added the constructor`Range()`.
DOM Parsing and Serialization Extensions to Range	Working Draft	Added the method`createContextualFragment()`.
CSS Object Model (CSSOM) View Module Extensions to Range	Working Draft	Added the methods`getClientRects()` and`getBoundingClientRect()`.
Document Object Model (DOM) Level 2 Traversal and Range Specification Range	Obsolete	Initial specification.

特性	Chrome	Firefox (Gecko)	Internet Explorer	Opera	Safari
Basic support	(Yes)	1.0 (1.7 or earlier) [1]	9.0	9.0	(Yes)
`Range()` constructor	(Yes)	24.0 (24.0)	未实现	15.0	(Yes)
`compareNode()`	未实现	1.0 (1.7 or earlier) Removed in 3.0 (1.9)	未实现	未实现	未实现
`isPointInRange()`, and `comparePoint()`	(Yes)	(Yes)	未实现	15.0	?
`intersectsNode()`	(Yes)	17.0 (17.0) [2]	未实现	15.0	?
`getClientRects()` and `getBoundingClientRect()`	(Yes)	4.0 (2.0)	9	15.0	5
`createContextualFragment()`	(Yes)	(Yes)	未实现	15.0	?

特性	Android	Firefox Mobile (Gecko)	IE Mobile	Opera Mobile	Safari Mobile
Basic support	(Yes)	1.0 (1.0) [1]	9.0	9.0	(Yes)

[1] Starting with Gecko 13.0 (Firefox 13.0 / Thunderbird 13.0 / SeaMonkey 2.10) the Range object throws a DOMException as defined in DOM 4, instead of a RangeException defined in prior specifications.

[2] Gecko supported it up to Gecko 1.9, then removed it until Gecko 17 where it was reimplemented, matching the spec.

扩展

The DOM interfaces index