是否可以使用Javascript获取文本的像素坐标并在其周围绘制矩形边框？

Question

我正在评估即将开展的项目的技术选项，其中一个要求是在文本字段中围绕某些单词组绘制一个矩形。 每次评估和解析文本时，它的某些已识别部分必须用矩形框，这也应该响应鼠标点击。甚至需要在该矩形的一个角上放置一个小三角形。 我无法控制要求，显然这个要求指出在文本字段（或div容器）中获取文本的像素位置，并使用某种覆盖机制来绘制矩形。 除非我使用错误的关键字，否则谷歌搜索不会返回任何有用的结果，我非常感谢您对此主题的意见。

最诚挚的问候 Seref Arikan Ps：任何有关使用javascript的高级浏览器dom图形的书籍/资源也值得赞赏。

Answer 1

我建议您查看此插件：http://johannburkard.de/blog/programming/javascript/highlight-javascript-text-higlighting-jquery-plugin.html

这不完全是你想要的，但你可能能够适应它。在运行内容中查找文本然后对其进行操作的工作有点混乱。

编辑请注意，该插件适用于HTML文档中的文本，而不适用于输入文本字段或<textarea>块中的文本。这很难做到，但可能有人做到了。

Answer 2

我建议您使用多个无边框文本字段，每个字段包含文本的单个部分（单词或字母），并根据需要使用边框设置包裹组，并将三角形设置为定位的背景图像。