iam*_*esy 6 html javascript dom
我想突出显示html页面中的一系列文本,并获得突出显示的位置,然后用于存储注释.
我的问题
我有一个文章页面,允许用户突出显示文本选择并添加注释.我有一点我可以在所选文本的右侧放置一个UI框来输入评论(想想谷歌文档).
我需要存储有关所选文本的信息,以便我可以将其链接到任何注释.理想情况下,我只会存储选定的文本,然后扫描该选择的内容.这有一个主要缺陷:如果内容中出现相同文本选择的两个或更多副本,该怎么办？
内容本身是存储在DB中的HTML.
例如,突出显示了以下段落的选择(粗体选择).我需要存储有关选择的信息,以便将来能够找到它:
"通过病毒利基有效地彻底改变可互操作的人力资本.通过全球社区全面地抓住世界级的潜力.客观地拥抱并行范式的多学科利基.专业."
到目前为止我做了什么
使用getBoundingClientRect()文本选择,range我可以得到页面顶部的距离.虽然对于定位UI注释框很有用,但我认为这不会帮助我将注释链接到所选文本.
我可以从中获取所选文本,window.getSelection()但可能会出现多次.
我不想修改内容.即span如果我可以帮助它,将选择包装在一个或类似的中,就像删除注释一样,删除标记可能会很棘手.
最好的办法是在文本中的偏移量上设置注释（即字符#100 到字符#150）。
当人们编辑您的文档时，您必须解决差异问题（如果他们不这样做，那就更好了！），因此，如果有人在放置评论的部分之前添加 10 个字符，则评论现在指向 110-160 。