使用`getSelection（）`时在`<div>`中省略`<span>`

Question

情况：

我有以下HTML：

<!--First div-->
<div>cat elephant</div>

我使用window.getSelection().focusOffset获取被点击的字符索引：

let index = window.getSelection().focusOffset;

Ex：如果单击div内字符串的“ c”字符，则index将为1； “ e”字符，则index将是5。

问题：

我将上述div的每个单词包装在span中，如下所示：

<!--Second div-->
<div><span>cat</span> <span>elephant</span></div>

并使用相同的脚本获取字符索引，然后输出意外。

如果我单击“ c”字符，则索引仍为1；但使用“ e”字符，则索引为1而不是5。

我想要的：

我希望第二个div与第一个div具有相同的行为，当我单击该字符以获取索引时。

编辑：

• 我也使用anchorOffset，但返回的结果相同。