HTML DOM Range compareBoundaryPoints() 方法

compareBoundaryPoints()方法用于将一个 Range的边界点与另一个Range 的边界点进行比较。

句法：

compare = firstRange.compareBoundaryPoints(comparision_method, otherRange);

返回值：此方法返回一个数字，指示边界点的位置：

• -1 ：如果第一个范围的边界点位于第二个范围的边界点之前，则返回 -1。
• 0 :如果第一个范围的边界点等于第二个范围的边界点，则返回 0。
• 1 :如果第一个范围的边界点位于第二个范围的边界点之后，则返回 1。

参数：该方法包含2个参数：

1.描述比较方法的常量：

• 范围。END_TO_END将第一个范围的结束边界点与第二个范围的结束边界点进行比较。
• 范围。END_TO_START将第一个范围的结束边界点与第二个范围的开始边界点进行比较。
• 范围。START_TO_END将第一个范围的起始边界点与第二个范围的结束边界点进行比较。
• Range.START_TO_START将第一个范围的起始边界点与第二个范围的起始边界点进行比较。

2. otherRange ：用于比较的其他范围。

示例：在示例中，我们将创建并比较两个范围。

HTML

HTML DOM range compareBoundaryPoints() method   


    GeeksforGeeks
    This is the Range 1 Content
    This is the Range 2 Content


    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);

输出：在控制台中，我们可以看到两个范围以及这些范围的记录比较。

输出是 -1，因为 range1 的 startOffset 是 3，并且在 range2 的 endOffset 之前是 6。

支持的浏览器： DOM compareBoundaryPoints() 方法支持的浏览器如下：

• 谷歌浏览器
• 边缘
• 火狐
• 苹果浏览器
• 歌剧
• IE浏览器