Range 介面代表一個文件的片段（fragment），可以包含節點及部分的文字節點。
A range can be created using the createRange() method of the Document object. Range objects can also be retrieved by using the getRangeAt() method of the Selection object or the caretRangeFromPoint() method of the Document object.
There also is the Range() constructor available.
屬性
There are no inherited properties.
Range.collapsedRead only- Returns a
Booleanindicating whether the range's start and end points are at the same position. Range.commonAncestorContainerRead only- Returns the deepest
Nodethat contains thestartContainerandendContainernodes. Range.endContainerRead only- Returns the
Nodewithin which theRangeends. Range.endOffsetRead only- Returns a number representing where in the
endContainertheRangeends. Range.startContainerRead only- Returns the
Nodewithin which theRangestarts. Range.startOffsetRead only- Returns a number representing where in the
startContainertheRangestarts.
建構式
方法
There are no inherited methods.
Range.setStart()- Sets the start position of a
Range. Range.setEnd()- Sets the end position of a
Range. Range.setStartBefore()- Sets the start position of a
Rangerelative to anotherNode. Range.setStartAfter()- Sets the start position of a
Rangerelative to anotherNode. Range.setEndBefore()- Sets the end position of a
Rangerelative to anotherNode. Range.setEndAfter()- Sets the end position of a
Rangerelative to anotherNode. Range.selectNode()- Sets the
Rangeto contain theNodeand its contents. Range.selectNodeContents()- Sets the
Rangeto contain the contents of aNode. Range.collapse()- Collapses the
Rangeto one of its boundary points. Range.cloneContents()- Returns a
DocumentFragmentcopying the nodes of aRange. Range.deleteContents()- Removes the contents of a
Rangefrom theDocument. Range.extractContents()- Moves contents of a
Rangefrom the document tree into aDocumentFragment. Range.insertNode()- Insert a
Nodeat the start of aRange. Range.surroundContents()- Moves content of a
Rangeinto a newNode. Range.compareBoundaryPoints()- Compares the boundary points of the
Rangewith anotherRange. Range.cloneRange()- Returns a
Rangeobject with boundary points identical to the clonedRange. Range.detach()- Releases the
Rangefrom use to improve performance. Range.toString()- Returns the text of the
Range. Range.compareNode()- Returns a constant representing whether the
Nodeis before, after, inside, or surrounding the range. Range.comparePoint()- Returns -1, 0, or 1 indicating whether the point occurs before, inside, or after the
Range. Range.createContextualFragment()- Returns a
DocumentFragmentcreated from a given string of code. Range.getBoundingClientRect()- Returns a
DOMRectobject which bounds the entire contents of theRange; this would be the union of all the rectangles returned byrange.getClientRects(). Range.getClientRects()- Returns a list of
DOMRectobjects that aggregates the results ofElement.getClientRects()for all the elements in theRange. Range.intersectsNode()- Returns a
booleanindicating whether the given node intersects theRange. Range.isPointInRange()- Returns a
booleanindicating whether the given point is in theRange.
規範
| Specification | Status | Comment |
|---|---|---|
| DOM The definition of 'Range' in that specification. |
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 The definition of 'Extensions to Range' in that specification. |
Working Draft | Added the method createContextualFragment(). |
| CSS Object Model (CSSOM) View Module The definition of 'Extensions to Range' in that specification. |
Working Draft | Added the methods getClientRects() and getBoundingClientRect(). |
| Document Object Model (DOM) Level 2 Traversal and Range Specification The definition of 'Range' in that specification. |
Obsolete | Initial specification. |
瀏覽器相容性
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!
| Feature | Chrome | Edge | Firefox (Gecko) | Internet Explorer | Opera | Safari |
|---|---|---|---|---|---|---|
| Basic support | (Yes) | (Yes) | 1.0 (1.7 or earlier) [1] | 9.0 | 9.0 | (Yes) |
Range() constructor |
(Yes) | ? | 24.0 (24.0) | No support | 15.0 | (Yes) |
compareNode() |
No support | ? | 1.0 (1.7 or earlier) Removed in 3.0 (1.9) |
No support | No support | No support |
isPointInRange(), and comparePoint() |
(Yes) | ? | (Yes) | No support | 15.0 | ? |
intersectsNode() |
(Yes) | ? | 17.0 (17.0) [2] | No support | 15.0 | ? |
getClientRects() and getBoundingClientRect() |
(Yes) | (Yes) | 4.0 (2.0) | 9 | 15.0 | 5 |
createContextualFragment() |
(Yes) | ? | (Yes) | 11 | 15.0 | ? |
| Feature | Android | Edge | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
|---|---|---|---|---|---|---|
| Basic support | (Yes) | (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.