JavaScript 在没有事件的情况下获取光标位置

在 Web 开发中，有时需要在没有事件的情况下获取光标位置，以便在需要时对其进行操作。在 JavaScript 中，可以使用 Selection 对象来获取光标位置。

获取 Selection 对象

要获取 Selection 对象，可以使用 document.getSelection() 方法。该方法可返回当前选中文本的 Selection 对象。如果没有选中文本，则返回 null。

const selection = document.getSelection();

获取光标位置

要获取光标位置，可以使用 Selection 对象的 getRangeAt() 方法。该方法可返回当前选中文本的第一个 Range 对象。因此，如果没有选中文本，则可以使用 getRangeAt(0) 方法来获取当前光标所在位置的 Range 对象。

const range = selection.getRangeAt(0);

然后，我们可以使用 Range 对象的 startOffset 和 endOffset 属性来获取光标位置。startOffset 表示选中文本或光标所在位置相对于其所属节点的起始位置的偏移量；endOffset 则表示其相对于节点的结束位置的偏移量。

const startPosition = range.startOffset;
const endPosition = range.endOffset;

完整代码

const selection = document.getSelection();
const range = selection.getRangeAt(0);
const startPosition = range.startOffset;
const endPosition = range.endOffset;

注意事项

• 如果没有选中文本，Selection 对象仍然可以返回，但其 isCollapsed 属性将为 true，而 Range 对象将为 null。
• 使用 Selection 对象和 Range 对象可以获取光标位置和选中文本，但对它们的修改不会影响实际内容。如果需要修改内容，请使用 DOM 操作或编辑器 API。