就业培训     下载中心     Wiki     联络
登录   注册
  1. 首页
  2. Web API
  3. 范围

在此页

范围 interface represents a fragment of a document that can contain nodes and parts of text nodes.

A range can be created by using the Document.createRange() method. Range objects can also be retrieved by using the getRangeAt() 方法在 Selection object or the caretRangeFromPoint() 方法在 Document 对象。

There also is the Range() constructor available.

特性

There are no inherited properties.

Range.collapsed 只读
返回 布尔 indicating whether the range's start and end points are at the same position.
Range.commonAncestorContainer 只读
Returns the deepest 节点 包含 startContainer and endContainer 节点。
Range.endContainer 只读
返回 节点 within which the 范围 ends.
Range.endOffset 只读
Returns a number representing where in the endContainer the 范围 ends.
Range.startContainer 只读
返回 节点 within which the 范围 starts.
Range.startOffset 只读
Returns a number representing where in the startContainer the 范围 starts.

构造函数

Range()
返回 范围 object with the global Document as its start and end.

方法

There are no inherited methods.

Range.setStart()
Sets the start position of a 范围 .
Range.setEnd()
Sets the end position of a 范围 .
Range.setStartBefore()
Sets the start position of a 范围 relative to another 节点 .
Range.setStartAfter()
Sets the start position of a 范围 relative to another 节点 .
Range.setEndBefore()
Sets the end position of a 范围 relative to another 节点 .
Range.setEndAfter()
Sets the end position of a 范围 relative to another 节点 .
Range.selectNode()
设置 范围 to contain the 节点 and its contents.
Range.selectNodeContents()
设置 范围 to contain the contents of a 节点 .
Range.collapse()
Collapses the 范围 to one of its boundary points.
Range.cloneContents()
返回 DocumentFragment copying the nodes of a 范围 .
Range.deleteContents()
Removes the contents of a 范围 从 Document .
Range.extractContents()
Moves contents of a 范围 from the document tree into a DocumentFragment .
Range.insertNode()
Insert a 节点 at the start of a 范围 .
Range.surroundContents()
Moves content of a 范围 into a new 节点 .
Range.compareBoundaryPoints()
Compares the boundary points of the 范围 with another 范围 .
Range.cloneRange()
返回 范围 object with boundary points identical to the cloned 范围 .
Range.detach()
释放 范围 from use to improve performance.
Range.toString()
Returns the text of the 范围 .
Range.compareNode()
Returns a constant representing whether the 节点 is 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.createContextualFragment()
返回 DocumentFragment created from a given string of code.
Range.getBoundingClientRect()
返回 DOMRect object which bounds the entire contents of the 范围 ; this would be the union of all the rectangles returned by range.getClientRects() .
Range.getClientRects()
Returns a list of DOMRect objects that aggregates the results of Element.getClientRects() for all the elements in the 范围 .
Range.intersectsNode()
返回 boolean indicating whether the given node intersects the 范围 .
Range.isPointInRange()
返回 boolean indicating whether the given point is in the 范围 .

规范

规范 状态 注释
DOM
The definition of 'Range' in that specification. 		实时标准 不使用 RangeException anymore, use DOMException 代替。
Made the second parameter of collapse() optional.
Added the methods isPointInRange() , comparePoint() ，和 intersectsNode() .
Added the constructor Range() .
DOM 剖析和序列化
The definition of 'Extensions to Range' in that specification. 		工作草案 Added the method createContextualFragment() .
CSSOM (CSS 对象模型) 视图模块
The definition of 'Extensions to Range' in that specification. 		工作草案 Added the methods getClientRects() and getBoundingClientRect() .
Document Object Model (DOM) Level 2 Traversal and Range Specification
The definition of 'Range' in that specification. 		过时 最初的规范。

浏览器兼容性

The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request. 更新 GitHub 上的兼容性数据
桌面 移动
Chrome Edge Firefox Internet Explorer Opera Safari Android webview Chrome for Android Firefox for Android Opera for Android Safari on iOS Samsung Internet
范围 Chrome 1 Edge 12 Firefox 4
4
Starting with Firefox 13, the 范围 object throws a DOMException as defined in DOM 4, instead of a RangeException defined in prior specifications.
IE 9 Opera 9 Safari 1 WebView Android 1 Chrome Android 18 Firefox Android 4
4
Starting with Firefox 13, the 范围 object throws a DOMException as defined in DOM 4, instead of a RangeException defined in prior specifications.
Opera Android 10.1 Safari iOS 1 Samsung Internet Android 1.0
Range() 构造函数 Chrome Yes Edge ≤18 Firefox 24 IE No Opera 15 Safari Yes WebView Android Yes Chrome Android Yes Firefox Android 24 Opera Android 14 Safari iOS Yes Samsung Internet Android Yes
cloneContents Chrome Yes Edge 12 Firefox 4 IE 9 Opera 9 Safari Yes WebView Android Yes Chrome Android Yes Firefox Android 4 Opera Android Yes Safari iOS Yes Samsung Internet Android Yes
cloneRange Chrome Yes Edge 12 Firefox 4 IE 9 Opera 9 Safari Yes WebView Android Yes Chrome Android Yes Firefox Android 4 Opera Android Yes Safari iOS Yes Samsung Internet Android Yes
collapse Chrome Yes Edge 12 Firefox 4 IE 9 Opera 9 Safari Yes WebView Android Yes Chrome Android Yes Firefox Android 4 Opera Android Yes Safari iOS Yes Samsung Internet Android Yes
collapsed Chrome Yes Edge 12 Firefox 4 IE 9 Opera 9 Safari Yes WebView Android Yes Chrome Android Yes Firefox Android 4 Opera Android Yes Safari iOS Yes Samsung Internet Android Yes
commonAncestorContainer Chrome Yes Edge 12 Firefox 4 IE 9 Opera 9 Safari Yes WebView Android Yes Chrome Android Yes Firefox Android 4 Opera Android Yes Safari iOS Yes Samsung Internet Android Yes
compareBoundaryPoints Chrome Yes Edge 12 Firefox 4 IE 9 Opera 9 Safari Yes WebView Android Yes Chrome Android Yes Firefox Android 4 Opera Android Yes Safari iOS Yes Samsung Internet Android Yes
compareNode 弃用 非标 Chrome No Edge No Firefox No IE No Opera No Safari No WebView Android No Chrome Android No Firefox Android No Opera Android No Safari iOS No Samsung Internet Android No
comparePoint Chrome Yes Edge 17 Firefox Yes IE No Opera 15 Safari Yes WebView Android Yes Chrome Android Yes Firefox Android Yes Opera Android 14 Safari iOS Yes Samsung Internet Android Yes
createContextualFragment Chrome Yes Edge 12 Firefox Yes IE 11 Opera 15 Safari 9 WebView Android Yes Chrome Android Yes Firefox Android Yes Opera Android 14 Safari iOS Yes Samsung Internet Android Yes
deleteContents Chrome Yes Edge 12 Firefox 4 IE 9 Opera 9 Safari Yes WebView Android Yes Chrome Android Yes Firefox Android 4 Opera Android Yes Safari iOS Yes Samsung Internet Android Yes
detach Chrome Yes
Yes
Since April 2014 this method is a no-op in Chrome .
Edge 12 Firefox 4 — 15
不支持 4 — 15
Starting in Firefox 15.0, this method is a no-op and has no effect.
IE 9 Opera 9 Safari Yes
Yes
Since August 2015 this method is a no-op in WebKit-based browsers .
WebView Android Yes Chrome Android Yes Firefox Android 4 — 15
不支持 4 — 15
Starting in Firefox 15.0, this method is a no-op and has no effect.
Opera Android Yes Safari iOS Yes
Yes
Since August 2015 this method is a no-op in WebKit-based browsers .
Samsung Internet Android Yes
endContainer Chrome Yes Edge 12 Firefox 4 IE 9 Opera 9 Safari Yes WebView Android Yes Chrome Android Yes Firefox Android 4 Opera Android Yes Safari iOS Yes Samsung Internet Android Yes
endOffset Chrome Yes Edge 12 Firefox 4 IE 9 Opera 9 Safari Yes WebView Android Yes Chrome Android Yes Firefox Android 4 Opera Android Yes Safari iOS Yes Samsung Internet Android Yes
extractContents Chrome Yes Edge 12 Firefox 4 IE 9 Opera 9 Safari Yes WebView Android Yes Chrome Android Yes Firefox Android 4 Opera Android Yes Safari iOS Yes Samsung Internet Android Yes
getBoundingClientRect Chrome Yes Edge 12 Firefox 4 IE 9 Opera 15 Safari Yes WebView Android Yes Chrome Android Yes Firefox Android 4 Opera Android 14 Safari iOS Yes Samsung Internet Android Yes
getClientRects Chrome Yes Edge 12 Firefox 4 IE 9 Opera 15 Safari 5 WebView Android Yes Chrome Android Yes Firefox Android 4 Opera Android 14 Safari iOS Yes Samsung Internet Android Yes
insertNode Chrome Yes Edge 12 Firefox 4 IE 9 Opera 9 Safari Yes WebView Android Yes Chrome Android Yes Firefox Android 4 Opera Android 10.1 Safari iOS Yes Samsung Internet Android Yes
intersectsNode Chrome Yes Edge 17 Firefox 17 IE No Opera 15 Safari Yes WebView Android Yes Chrome Android Yes Firefox Android 19 Opera Android 14 Safari iOS Yes Samsung Internet Android Yes
isPointInRange Chrome Yes Edge 15 Firefox Yes IE No Opera 15 Safari Yes WebView Android Yes Chrome Android Yes Firefox Android Yes Opera Android 14 Safari iOS Yes Samsung Internet Android Yes
selectNode Chrome Yes Edge 12 Firefox 4 IE 9 Opera 9 Safari Yes WebView Android Yes Chrome Android Yes Firefox Android 4 Opera Android Yes Safari iOS Yes Samsung Internet Android Yes
selectNodeContents Chrome Yes Edge 12 Firefox 4 IE 9 Opera 9 Safari Yes WebView Android Yes Chrome Android Yes Firefox Android 4 Opera Android Yes Safari iOS Yes Samsung Internet Android Yes
setEnd Chrome Yes Edge 12 Firefox 4 IE 9 Opera 9 Safari Yes WebView Android Yes Chrome Android Yes Firefox Android 4 Opera Android Yes Safari iOS Yes Samsung Internet Android Yes
setEndAfter Chrome Yes Edge 12 Firefox 4 IE 9 Opera 9 Safari Yes WebView Android Yes Chrome Android Yes Firefox Android 4 Opera Android Yes Safari iOS Yes Samsung Internet Android Yes
setEndBefore Chrome Yes Edge 12 Firefox 4 IE 9 Opera 9 Safari Yes WebView Android Yes Chrome Android Yes Firefox Android 4 Opera Android Yes Safari iOS Yes Samsung Internet Android Yes
setStart Chrome Yes Edge 12 Firefox 4 IE 9 Opera 9 Safari Yes WebView Android Yes Chrome Android Yes Firefox Android 4 Opera Android Yes Safari iOS Yes Samsung Internet Android Yes
setStartAfter Chrome Yes Edge 12 Firefox 4 IE 9 Opera 9 Safari Yes WebView Android Yes Chrome Android Yes Firefox Android 4 Opera Android Yes Safari iOS Yes Samsung Internet Android Yes
setStartBefore Chrome Yes Edge 12 Firefox 4 IE 9 Opera 9 Safari Yes WebView Android Yes Chrome Android Yes Firefox Android 4 Opera Android Yes Safari iOS Yes Samsung Internet Android Yes
startContainer Chrome Yes Edge 12 Firefox 4 IE 9 Opera 9 Safari Yes WebView Android Yes Chrome Android Yes Firefox Android 4 Opera Android Yes Safari iOS Yes Samsung Internet Android Yes
startOffset Chrome Yes Edge 12 Firefox 4 IE 9 Opera 9 Safari Yes WebView Android Yes Chrome Android Yes Firefox Android 4 Opera Android Yes Safari iOS Yes Samsung Internet Android Yes
surroundContents Chrome Yes Edge 12 Firefox 4 IE 9 Opera 9 Safari Yes WebView Android Yes Chrome Android Yes Firefox Android 4 Opera Android Yes Safari iOS Yes Samsung Internet Android Yes
toString Chrome Yes Edge 12 Firefox 4 IE 9 Opera 9 Safari Yes WebView Android Yes Chrome Android Yes Firefox Android 4 Opera Android Yes Safari iOS Yes Samsung Internet Android Yes

图例

完整支持

完整支持

不支持

不支持

实验。期望将来行为有所改变。

实验。期望将来行为有所改变。

非标。预期跨浏览器支持较差。

非标。预期跨浏览器支持较差。

弃用。不要用于新网站。

弃用。不要用于新网站。

见实现注意事项。

另请参阅

元数据

  • 最后修改：
  1. DOM (文档对象模型)
  2. 范围
  3. 构造函数
    1. Range()
  4. 特性
    1. collapsed
    2. commonAncestorContainer
    3. endContainer
    4. endOffset
    5. startContainer
    6. startOffset
  5. 方法
    1. cloneContents()
    2. cloneRange()
    3. collapse()
    4. compareBoundaryPoints()
    5. compareNode()
    6. comparePoint()
    7. createContextualFragment()
    8. deleteContents()
    9. detach()
    10. extractContents()
    11. getBoundingClientRect()
    12. getClientRects()
    13. insertNode()
    14. intersectsNode()
    15. isPointInRange()
    16. selectNode()
    17. selectNodeContents()
    18. setEnd()
    19. setEndAfter()
    20. setEndBefore()
    21. setStart()
    22. setStartAfter()
    23. setStartBefore()
    24. surroundContents()
    25. toString()
  6. 继承：
    1. AbstractRange
  7. DOM 相关页面
    1. AbortController
    2. AbortSignal
    3. AbstractRange
    4. Attr
    5. ByteString
    6. CDATASection
    7. CSSPrimitiveValue
    8. CSSValue
    9. CSSValueList
    10. CharacterData
    11. ChildNode
    12. 注释
    13. CustomEvent
    14. DOMConfiguration
    15. DOMError
    16. DOMErrorHandler
    17. DOMException
    18. DOMImplementation
    19. DOMImplementationList
    20. DOMImplementationRegistry
    21. DOMImplementationSource
    22. DOMLocator
    23. DOMObject
    24. DOMParser
    25. DOMPoint
    26. DOMPointInit
    27. DOMPointReadOnly
    28. DOMRect
    29. DOMString
    30. DOMTimeStamp
    31. DOMTokenList
    32. DOMUserData
    33. Document
    34. DocumentFragment
    35. DocumentType
    36. 元素
    37. ElementTraversal
    38. Entity
    39. EntityReference
    40. 事件
    41. EventTarget
    42. HTMLCollection
    43. MutationObserver
    44. 节点
    45. NodeFilter
    46. NodeIterator
    47. NodeList
    48. NonDocumentTypeChildNode
    49. ProcessingInstruction
    50. PromiseResolver
    51. StaticRange
    52. 文本
    53. TextDecoder
    54. TextEncoder
    55. TimeRanges
    56. TreeWalker
    57. TypeInfo
    58. USVString
    59. UserDataHandler
    60. XMLDocument

版权所有  © 2014-2026 乐数软件    

工业和信息化部： 粤ICP备14079481号-1