正文
釋義
Range 對象表示文檔中的連續範圍。Range 對象
Range 對象表示文檔的連續範圍區域，如用戶在瀏覽器視窗中用滑鼠拖動選中的區域。如果一個實現支持 Range 模組，那么 Document 對象就定義了 createRange() 方法，調用它可創建新的 Range 對象。
注意：IE 定義了不兼容的 Document.createRange() 方法，它返回的對象與 Rang 接口相似，但不兼容。
Range 接口為指定文檔“選中”的區域定義了大量的方法，此外還有幾個方法可以用於在選中的區域中進行剪下和貼上類型的操作。
Range 接口的屬性提供了獲取範圍的邊界節點和偏移量的方法。它的方法提供了設定範圍邊界的方法。注意，範圍的邊界可以設定為 Document 或 DocumentFragment 對象中的節點。一旦定義了範圍的邊界點，就可以使用 deleteContents()、extractContents()、cloneContents() 和 insertNode() 方法實現剪下、複製和貼上的操作。
當通過插入或刪除操作改變了文檔時，表示文檔一部分的所有 Range 對象都將改變（如果必要的話），以便使它們的邊界點保持有效，並且讓它們（儘可能接近地）表示同樣的文檔內容。
術語
一個範圍具有兩個邊界點，即一個開始點和一個結束點。每個邊界點由一個節點和那個節點的偏移量指定。該節點通常是 Element 節點、Document 節點或 Text 節點。對於 Element 節點和 Document 節點，偏移量指該節點的子節點。偏移量為 0，說明邊界點位於該節點的第一個子節點之前。偏移量為 1，說明邊界點位於該節點的第一個子節點之後，第二個子節點之前。但如果邊界節點是 Text 節點，偏移量則指的是文本中兩個字元之間的位置。常量
這些常量指定了如何比較 Range 對象的邊界點。它們是 compareBoundaryPoints() 方法的 how 參數的合法值：
常量 | 描述 |
|---|---|
START_TO_START | 用指定範圍的開始點與當前範圍的開始點進行比較。 |
START_TO_END | 用指定範圍的開始點與當前範圍的結束點進行比較。 |
END_TO_END | 用指定範圍的結束點與當前範圍的結束點進行比較。 |
END_TO_START | 用指定範圍的結束點與當前範圍的開始點進行比較。 |
屬性
注意：所有屬性都是唯讀的，不能通過設定這些屬性改變範圍的開始點和結束點，必須調用 setEnd() 方法和 setStart() 方法實現這一點。注意：調用 detach() 方法後，對這些屬性的任何讀操作都會拋出代碼為 INVALID_STATE_ERR 的DOMException 異常。
屬性 | 描述 |
|---|---|
collapsed | 如果範圍的開始點和結束點在文檔的同一位置，則為 true，即範圍是空的，或摺疊的。 |
commonAncestorContainer | 範圍的開始點和結束點的、嵌套最深的 Document 節點。 |
endContainer | 包含範圍的結束點的 Document 節點。 |
endOffset | endContainer 中的結束點位置。 |
startContainer | 包含範圍的開始點的 Document 節點。 |
startOffset | startContainer 中的開始點位置。 |
方法
注意：如果調用了範圍的 detach() 方法，那么接下來調用 Range 對象的任何方法都會拋出代碼為 INVALID_STATE_ERR 的 DOMException 異常。方法 | 描述 |
|---|---|
cloneContents() | 返回新的 DocumentFragment 對象，它包含該範圍表示的文檔區域的副本。 |
cloneRange() | 創建一個新的 Range 對象，表示與當前的 Range 對象相同的文檔區域。 |
collapse() | 摺疊該範圍，使它的邊界點重合。 |
compareBoundaryPoints() | 比較指定範圍的邊界點和當前範圍的邊界點，根據它們的順序返回 -1、0 和 1。比較哪個邊界點由它的第一個參數指定，它的值必須是前面定義的常量之一。 |
deleteContents() | 刪除當前 Range 對象表示的文檔區域。 |
detach() | 通知實現不再使用當前的範圍，可以停止跟蹤。如果調用了範圍的這個方法，那么接下來調用的該範圍任何方法都會拋出代碼為 INVALID_STATE_ERR 的DOMException 異常。 |
extractContents() | 刪除當前範圍表示的文檔區域，並且以 DocumentFragment 對象的形式返回那個區域的內容。該方法和 cloneContents() 方法與 deleteContents() 方法的組合很相似。 |
insertNode() | 把指定的節點插入文檔範圍的開始點。 |
selectNode() | 設定該範圍的邊界點，使它包含指定的節點和它的所有子孫節點。 |
selectNodeContents() | 設定該範圍的邊界點，使它包含指定節點的子孫節點，但不包含指定的節點本身。 |
setEnd() | 把該範圍的結束點設定為指定的節點和偏移量。 |
setEndAfter() | 把該範圍的結束點設定為緊鄰指定節點的節點之後。 |
setEndBefore() | 把該範圍的結束點設定為緊鄰指定節點之前。 |
setStart() | 把該範圍的開始點設定為指定的節點中的指定偏移量。 |
setStartAfter() | 把該範圍的開始點設定為緊鄰指定節點的節點之後。 |
setStartBefore() | 把該範圍的開始點設定為緊鄰指定節點之前。 |
surroundContents() | 把指定的節點插入文檔範圍的開始點，然後重定範圍中的所有節點的父節點，使它們成為新插入的節點的子孫節點。 |
toString() | 返回該範圍表示的文檔區域的純文本內容。 |
