XML DOM - Objeto Range

El objeto Range representa un rango continuo en el documento.

Objeto Range

El objeto Range representa un área de rango continuo del documento, como el área seleccionada que el usuario selecciona con el ratón en la ventana del navegador.

Si una implementación admite el módulo Range, entonces Objeto Documentdefinido Método createRange()，llamarlo puede crear nuevos objetos Range.

注意：IE definió el método incompatibles Document.createRange(), que devuelve un objeto similar al interfaz Range, pero incompatibles.

El interfaz Range define una gran cantidad de métodos para definir el área seleccionada del documento, además de algunos métodos que se pueden usar para realizar operaciones de cortar y pegar en el área seleccionada.

Las propiedades del interfaz Range proporcionan métodos para obtener los nodos de borde y el desplazamiento del rango. Sus métodos proporcionan métodos para establecer los bordes del rango. Nota, los bordes del rango pueden establecerse Documento o Objeto DocumentFragmentde los nodos. Una vez definidos los puntos de borde del rango, se pueden utilizar los métodos deleteContents(), extractContents(), cloneContents() y insertNode() para realizar operaciones de cortar, copiar y pegar.

Cuando se cambia el documento mediante operaciones de inserción o eliminación, todos los objetos Range que representan una parte del documento cambiarán (si es necesario), para mantener válidos sus puntos de borde y para que representen el mismo contenido del documento (lo más cerca posible).

Término: rango, punto de borde y desplazamiento

Un rango tiene dos puntos de borde, es decir, un punto de inicio y un punto de final. Cada punto de borde se especifica por un nodo y el desplazamiento de ese nodo. El nodo generalmente es Nodo Element、Nodo Documentoo Nodo TextoPara los nodos Element y Document, el desplazamiento se refiere a los subnodos del nodo. Un desplazamiento de 0 indica que el punto de borde está antes del primer subnodo del nodo. Un desplazamiento de 1 indica que el punto de borde está después del primer subnodo del nodo y antes del segundo subnodo. Sin embargo, si el nodo de borde es un nodo Texto, el desplazamiento se refiere a la posición entre dos caracteres del texto.

Range 对象的常量

这些常量指定了如何比较 Range 对象的边界点。

它们是 compareBoundaryPoints() 方法的 how 参数的合法值：

常量 描述
START_TO_START 用指定范围的开始点与当前范围的开始点进行比较。
START_TO_END 用指定范围的开始点与当前范围的结束点进行比较。
END_TO_END 用指定范围的结束点与当前范围的结束点进行比较。
END_TO_START 用指定范围的结束点与当前范围的开始点进行比较。

Range 对象的属性

注意：所有属性都是只读的，不能通过设置这些属性改变范围的开始点和结束点，必须调用 setEnd() 方法和 setStart() 方法实现这一点。

注意：调用 detach() 方法后，对这些属性的任何读操作都会抛出代码为 INVALID_STATE_ERR 的 Excepción DOMException.

属性 描述
collapsed 如果范围的开始点和结束点在文档的同一位置，则为 true，即范围是空的，或折叠的。
commonAncestorContainer 范围的开始点和结束点的（即它们的祖先节点）、嵌套最深的 Document 节点。
endContainer 包含范围的结束点的 Document 节点。
endOffset endContainer 中的结束点位置。
startContainer 包含范围的开始点的 Document 节点。
startOffset startContainer 中的开始点位置。

Range 对象的方法

注意：如果调用了范围的 detach() 方法，那么接下来调用 Range 对象的任何方法都会抛出代码为 INVALID_STATE_ERR 的 Excepción DOMException.

方法 描述
cloneContents() 返回新的 DocumentFragment 对象，它包含该范围表示的文档区域的副本。
cloneRange() 创建一个新的 Range 对象，表示与当前的 Range 对象相同的文档区域。
collapse() Plegar el rango para que sus puntos de borde se superpongan.
compareBoundaryPoints() Comparar los puntos de borde de los rangos especificados y los puntos de borde del rango actual, devolver -1, 0 y 1 según su orden. El punto de borde que se compara se especifica por el primer parámetro, su valor debe ser uno de los constantes definidos anteriormente.
deleteContents() Elimina la región de documento representada por el objeto Range actual.
detach() Notifica que la implementación ya no utiliza el rango actual, puede detener el seguimiento. Si se llama a este método del rango, cualquier otro método llamado en el rango lanzará una excepción con el código INVALID_STATE_ERR. Excepción DOMException.
extractContents() Elimina la región de documento representada por el rango actual y devuelve el contenido de esa región en forma de objeto DocumentFragment. Este método, combinado con deleteContents(), es muy similar al método cloneContents().
insertNode() Inserta el nodo especificado en el punto de inicio del rango de documento.
selectNode() Establece los puntos de borde del rango para que contengan el nodo especificado y todos sus descendientes.
selectNodeContents() Establece los puntos de borde del rango para que contengan los descendientes del nodo especificado, pero no al nodo especificado en sí.
setEnd() Establece el punto de final del rango en el nodo especificado y el desplazamiento.
setEndAfter() Establece el punto de final del rango en el nodo inmediatamente después del nodo especificado.
setEndBefore() Establece el punto de final del rango en el nodo inmediatamente antes del nodo especificado.
setStart() Establece el punto de inicio del rango en la cantidad de desplazamiento especificada dentro del nodo.
setStartAfter() Establece el punto de inicio del rango en el nodo inmediatamente después del nodo especificado.
setStartBefore() Establece el punto de inicio del rango en el nodo inmediatamente antes del nodo especificado.
surroundContents() Inserta el nodo especificado en el punto de inicio del rango de documento, luego reasigna los nodos padre de todos los nodos en el rango, para que se conviertan en descendientes del nodo insertado.
toString() Devuelve el contenido de texto puro de la región de documento representada por este rango.