首页 / JAVASCRIPT / javascript-Range.compareBoundaryPoints()产生奇怪的结果

javascript-Range.compareBoundaryPoints()产生奇怪的结果

内容导读

互联网集市收集整理的这篇技术教程文章主要介绍了javascript-Range.compareBoundaryPoints()产生奇怪的结果，小编现在分享给大家，供广大互联网技能从业者学习和参考。文章包含1980字，纯文字阅读大概需要3分钟。

内容图文

我正在使用Range对象作为代表当前选择的另一个Range对象上的限制器,以便修剪掉选定范围内但超出限制范围边界的所有内容.为了比较两个Range的位置,我使用Range.compareBoundaryPoints()函数,但是结果没有意义.

我正在使用的元素如下所示：

<p id="myBlock" contenteditable="true">
  Hello hello hello, this is a great big block of test text.
</p>

定义范围,并按以下方式检索它们的位置关系：

var limitingRange = document.createRange();
limitingRange.selectNodeContents($('#myBlock')[0]);
var selectedRange = window.getSelection().getRangeAt(0).cloneRange(); //Use whatever method is supported by the browser to get the Range

var endToStart = limitingRange.compareBoundaryPoints(Range.END_TO_START, selectedRange);
var startToEnd = limitingRange.compareBoundaryPoints(Range.START_TO_END, selectedRange);
var startToStart = limitingRange.compareBoundaryPoints(Range.START_TO_START, selectedRange);
var endToEnd = limitingRange.compareBoundaryPoints(Range.END_TO_END, selectedRange);

然后,我在文本中选择单词“ this”并运行该功能.我的范围看起来像这样(我发明了.start和.end表示法,试图使我的描述更清楚)：

你好,(selectedRange.start)这(selectedRange.end)是一个很大的测试文本块.(limitingRange.end)

结果值为：
endToStart = -1
startToEnd = 1
startToStart = -1
endToEnd = 1

我对如何解释函数结果感到困惑.根据规范,例如,如果selectedRange的末尾在limitingRange的开始之前,则endToStart应该包含-1,但是显然并非如此.这里发生了什么？

解决方法:

我在回答自己的问题：键入正在发生的事情使我真正了解了函数的行为,这确实很奇怪.

a.compareBoundaryPoints(X_TO_Y,b)的结果是a.Y与b.X的比较.如果a.Y在b.X之前,则为-1；如果它们在同一位置,则为0；如果在之后,则为1.

因此,在上述示例的endToStart中,正在将limitingRange.start与selectedRange.end进行比较,其中-1表示limitingRange.start首先出现.

startToEnd：limitingRange.end在selectedRange.start之后,因此结果为1.
startToStart：limitingRange.start在selectedRange.start之前,因此结果为-1.
endToEnd：limitingRange.end在selectedRange.end之后,因此结果为1

让我只问一个问题：为什么这个函数会这样？常数的名称与人们的直觉期望相反.

内容总结

以上是互联网集市为您收集整理的javascript-Range.compareBoundaryPoints()产生奇怪的结果全部内容，希望文章能够帮你解决javascript-Range.compareBoundaryPoints()产生奇怪的结果所遇到的程序开发问题。 如果觉得互联网集市技术教程内容还不错，欢迎将互联网集市网站推荐给程序员好友。

内容备注

版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 gblab@vip.qq.com 举报，一经查实，本站将立刻删除。

内容手机端

扫描二维码推送至手机访问。

本文链接：https://qyyshop.com/info/675309.html

来源：【匿名】