javascript - 无论如何 getSelection 方法忽略html标签

Question

我想保存范围，并在重新加载页面后使用这些值突出显示（例如黄色），但问题是getRangeAt(0)不能正确返回范围。它的范围在任何 html 标签后重新启动，我该如何解决这个问题？

<p id="content">
  hello <br> John 
</p>

document.addEventListener("selectionchange", () => {
  $("#content").bind("touchend mouseup", function() {
    var t = window.getSelection();
    var range=t.getRangeAt(0);
    var text=t.toString();
                    
    if(text! = "") {
      var rect = range.getBoundingClientRect();
      var start=range.startOffset;
      var end=range.endOffset;
      console.log(start, ' = ', end);
    }
  });
});

在这种情况下，如果我选择“hello”，getRangeAt(0) 返回 0,4，然后如果我选择“John”，它会再次返回 0,4。

标签： javascripthtmltagsfrontendgetselection