当我只知道字符偏移量时,如何创建范围对象?

2023-11-23

所以我有一个包含文本块的 div,之前用户已在该块中选择了一些文本,并且我从该选择中创建了一个范围对象。我存储了所选文本的起点和终点的偏移量,但在重新创建范围时遇到问题(以便我可以操纵它)。 “quotables”是保存所有文本的 div。我不知道我做错了什么。



    var theRange = rangy.createRange();
    var node = $('.quotables').html();
    theRange.setStart(node, 14);
    theRange.setEnd(node, 318);


但我不断收到错误: 未捕获的错误:NOT_FOUND_ERR:DOM 异常 8
m.setStart
(匿名函数)
d.extend._Deferred.f.resolveWith
d.d.扩展就绪
d.c.addEventListener.y


范围边界不是 HTML 字符串表示形式中的字符偏移量。相反,它是 DOM 节点内的偏移量。例如,如果节点是文本节点,则边界表示为节点文本内的字符偏移量。如果该节点是一个元素,则表示为该节点在边界之前的子节点数。例如,在下面的 HTML 中,有一个范围,其边界由|:

<div id="test">foo|bar<br>|<br></div>

...范围的起始边界位于文本节点中的偏移量 3 处,该文本节点是该文本节点的第一个子节点<div>元素,而结束边界位于偏移 2 处<div>,因为有两个子节点(文本节点“foobar”和一个<br>元素)位于边界之前。您可以按如下方式以编程方式创建范围:

var range = rangy.createRange(); // document.createRange() if not using Rangy
var div = document.getElementById("test");
range.setStart(div.firstChild, 3);
range.setEnd(div, 2);
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

当我只知道字符偏移量时,如何创建范围对象? 的相关文章

  • JQuery:如何仅在完成调整大小后调用 RESIZE 事件?

    浏览器窗口大小调整完毕后 如何调用函数 我正在尝试这样做 但遇到了问题 我正在使用 JQuery Resize 事件函数 window resize function how to call only once the browser ha
  • Open Layers 3 根据矢量图层的范围将地图居中?

    我想根据矢量图层特征 点 来定位地图的中心和缩放级别 我有一个 geojson 文件正在填充我的地图 var vectorSource new ol source Vector url assets js data geojson form
  • 使用映射更新没有对象的数组

    如果我有一个像这样的对象数组 name james name john 我知道 john 的索引并且想要更改 john 的值我会做 person person map p i gt i index p name changed john p
  • d3.js:将样式应用于单行

    正在尝试可拖动网络 http bl ocks org mbostock 4566102并希望能够对不同的链接使用不同的颜色 当我注释掉这些行时 var link svg append g attr class link selectAll
  • Javascript - 获取和设置基元的属性隐式创建对象包装器

    我正在读一本书 名叫有效的 JavaScript 利用 JavaScript 力量的 68 种具体方法 第 4 点 Prefer Primitives to Object Wrappers 并遇到这句话 获取和设置基元的属性会隐式创建对象
  • 选择移动 Web HTML5 框架 [关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心 help reopen questi
  • 网站是否可以跟踪用户的 chrome 扩展程序或他们的行为?

    我对网站访问者的 Chrome 扩展程序及其功能非常感兴趣 传出网络通讯 文件保存 存储等 有没有可能检测到这些 No 这将是对隐私的严重侵犯 最接近检测扩展的方法是检查页面的 DOM 和 JS 环境 看看浏览器是否以您意想不到的方式修改了
  • Node.js、Socket.io:如何获取客户端浏览器语言?

    我正在尝试使用 socket io 和 node js 获取用户使用的语言 以便为播放视频提供正确的声音文件 我是node js 和socket io 的初学者 我通过 navigator language 在客户端获取了语言 并希望在连接
  • yii2 将 JS 文件注册到视图

    我有 A php 视图文件 views A 文件夹 我有 A js js 文件 views A 文件夹 请帮我在视图文件中注册js文件 据我了解 我必须写 this gt registerJsFile path to file js 在视图
  • Javascript树遍历算法

    我需要帮助以深度优先的方式遍历树结构 我无法想出一个算法来正确地做到这一点 我的输入是这样的 A B C 1 2 a b c d 输出应采用以下形式 A 1 a A 1 b A 1 c A 1 d A 2 a A 2 b A 2 c A 2
  • 从立即调用的匿名函数表达式返回 |它去哪里?

    如果我从立即调用的匿名函数表达式返回一个对象 它会去哪里 例如 这段代码中 foo 去了哪里 function var foo return foo 这有什么有用的应用吗 从自执行函数返回一个值而不将该返回值分配给结果变量只是一个无处可去的
  • 检查用户是否连接到 Facebook,然后检查他是否喜欢某个页面

    有没有什么方法可以检查用户是否在我的外部页面上连接到 Facebook 而不让他们允许我的应用程序之一 同样的问题也适用于 检查用户是否喜欢某个页面 我检查了大约 20 个问题和 3 4 个教程 似乎所有问题都在讨论内部脚本 粉丝页面 应用
  • 如何在光标下的所有元素上调用 mouseover?

    我有一个网络应用程序 每次单击时都会创建一个点 见下文 当我将鼠标悬停在一堆点上时 我希望光标下的每个点都会触发 mouseover 或 mouseenter 事件 然而 只有一个事件被触发 即堆栈 顶部 的点的事件 当鼠标移动到一堆多个点
  • 使用 CSS Flexbox 堆叠图像

    我正在学习使用CSSflexbox 和我想在左侧渲染一个大图像 并在彼此之上渲染两个小图像 我怎样才能使用CSS弹性盒 div class container img class image1 src alt null img class
  • 检查 DOM 元素是否为复选框

    如何检查给定的 DOM 元素是否为复选框 设想 我有一组文本框和复选框 其中的值是动态分配的 我没有办法识别 DOM 元素是复选框还是文本框 只使用普通的 javascript 你就可以做到 if el type el type check
  • 在 TCPDF 中设置背景颜色

    我已经手动设置了第一页的背景颜色 如下所示 pdf gt AddPage pdf gt SetFillColor 52 21 0 76 pdf gt Rect 0 0 pdf gt getPageWidth pdf gt getPageHe
  • 未捕获的类型错误:this.props.signinUser 不是一个函数(…)

    src actions index js import axios from axios const ROOT URL http localhost 3090 export function signinUser email passwor
  • HTML5 服务器端事件:EventSource 与包装的 WebSocket

    HTML5 服务器发送事件 SSE API 是否只是 HTML5 WebSocket 之上的受限制的 基于事件的 API 在我看来 一个EventSource只是一个WebSocket that Cannot send data 使用tex
  • Three.js - 在代码中包含网格数据

    我有这个 Three js 代码 其中 JSON 加载器从文件 models mountain json 加载网格 var Three new function this scene new THREE Scene this camera
  • JavaScript 变量赋值与 OR 对比 if 检查[重复]

    这个问题在这里已经有答案了 在 JavaScript 中 我最近意识到你可以使用 OR 赋值的逻辑运算符 我想知道这是否被认为是不好的做法 特别是 我有一些具有可选数组输入的函数 如果输入是null or undefined我应该将它设置为

随机推荐