Grammarly 和 languagetools 这样的应用如何知道输入框中拼写错误的确切位置？

Question

如果您的浏览器中启用了 Grammarly 和 languagetools 等扩展程序。您在任何网站上输入某个输入框吗？ 现在我们知道可以知道输入 html 元素内的文本。假设通过一些 api，我们能够知道哪个单词拼写错误。现在，他们如何能够在该单词下方绘制一条红线，就像我们知道我们无法将 css 属性应用于输入 html 元素内的文本一样？

Answer 1

我不确定，但他们可能会使用

getClientRects()

来查找坐标，然后将线条放置为绝对位置元素。

Answer 2

您可以先使用

range()

通过字符串索引来获取您想要的文本信息，然后使用

range.getClientRects()

来获取所选文本的位置，您可以根据这些位置信息进行一些定位操作。