javascript - 在 contenteditable div 边缘案例中突出显示

Question

我正在努力使内容可编辑的 div 文本突出显示或不突出显示。但是我面临一个边缘情况，如果我将鼠标拖到文本上并通过狂野拖拽结束，我的 div 也会被选中。这意味着如果我打印范围，它会给我父元素作为结束容器。

<div class = "XYZ">
 <span class = "highlighted">ABCD</span>
</div> 

当我记录 range.endContainer 时，它会打印 XYZ。

另外我正在使用 range.setStart() 和 range.setEnd() 方法来调整我的范围，这意味着我在以下情况下失败了：

<div class = "XYZ">
 <span class = "unhighlighted">ABCD</span>
</div>


range.setEnd(range.endContainer, range.endContainer.textContent.length)

我确定我在设置范围的结束部分时犯了错误，但我不知道在哪里......有人可以帮忙吗？