El método compareBoundaryPoints() se utiliza para comparar los puntos límite de un rango con los puntos límite de otro rango.
Sintaxis:
compare = firstRange.compareBoundaryPoints(comparision_method, otherRange);
Valor devuelto: este método devuelve un número que indica la posición de los puntos límite:
- -1: devuelve -1 si el punto límite del primer rango se encuentra antes del punto límite del segundo rango.
- 0: devuelve 0 si el punto límite del primer rango es igual al punto límite del segundo rango.
- 1: devuelve 1 si el punto límite del primer rango se encuentra después del punto límite del segundo rango.
Parámetros: Este método contiene 2 parámetros:
1. Una constante que describe el método de comparación:
- Range.END_TO_END para comparar el punto límite final del primer rango con el punto límite final del segundo rango.
- Range.END_TO_START compara el punto límite final del primer rango con el punto límite inicial del segundo rango.
- Range.START_TO_END compara el punto límite inicial del primer rango con el punto límite final del segundo rango.
- Range.START_TO_START compara el punto límite inicial del primer rango con el punto límite inicial del segundo rango.
2. otherRange: Otro rango para comparar.
Ejemplo: En el ejemplo, crearemos y compararemos dos rangos.
HTML
<html>
<head>
<title>HTML DOM range compareBoundaryPoints() method</title>
</head>
<body>
<h1>GeeksforGeeks</h1>
<div>This is the Range 1 Content</div>
<div>This is the Range 2 Content</div>
</body>
<script>
var range1, range2, compare;
range1 = document.createRange();
range1.selectNode(document.getElementsByTagName("div")[0]);
console.log(range1);
range2 = document.createRange();
range2.selectNode(document.getElementsByTagName("div")[1]);
console.log(range2);
compare = range1.compareBoundaryPoints(Range.START_TO_END, range2);
console.log(compare);
</script>
</html>
Salida: en la consola, podemos ver la comparación registrada de ambos rangos junto con esos rangos.
la salida es -1, ya que startOffset de range1 es 3 y está antes de que endOffset de range2 sea 6.
Navegadores compatibles: los navegadores compatibles con el método DOM compareBoundaryPoints() se enumeran a continuación:
- Google Chrome
- Borde
- Firefox
- Safari
- Ópera
- explorador de Internet