检索DOM textnode位置

是否可以检索文本节点的几何位置（即从父元素、页面等的顶部/左侧偏移量）？

请查看-它使用offsetParent属性递归计算偏移量

---

我总是建议使用jquery，而不是使用您自己的方法来处理类似这样的各种浏览器。他们似乎有你需要的方法

没有任何内置的跨浏览器方式来实现这一点。我会的 将jQuery与维度插件一起使用：

---

它是跨浏览器的，将为您提供高度、宽度和x&y偏移等信息。

不是直接提供的。TextNode没有最初用于在视口定位时测量的IE offset*（和类似）扩展名

仅在IE上，您可以创建TextRange对象，费力地尝试将其与TextNode的边界对齐，然后测量TextRange的boundingLeft/boundingTop，并将其添加到父元素的位置（通过常规方法获得）。然而，对于一个可能不稳定的单浏览器解决方案来说，这是一系列工作

另一种可以避免的方法是将文本包装在span元素中（在文档中，或者通过脚本动态和/或临时），并使用span来测量位置，前提是它没有拾取任何可能影响位置的其他样式。但是请注意，包裹的跨度可能不会给出预期的右/底部值；根据您想用它做什么，您可能最终会包装第一个和最后一个字符或其他一些安排

---

总之：嗯，没什么好的。

现在有办法。单向：getBoundingRectangle:

今天，您可以通过

Range.getBoundingClientRect（）

。IE9+

//获取文本节点
const el=document.querySelector（'strong'））
const textNode=el.firstChild；
//通过范围获取坐标
常量范围=document.createRange（）；
范围。选择节点（文本节点）；
常量坐标=range.getBoundingClientRect（）
控制台日志（坐标）
/*演示CSS，忽略，高亮显示框坐标*/body{max width:300px}strong{position:relative}strong，strong:before{border:solid 1px red}strong:before{content:''；position:absolute；right:100%；bottom:100%；width:100vw；height:100vh；指针事件：none}
红线将显示所选文本节点相对于视口的坐标边界框


函数getBoundingClientRetext（textNode）{
常量范围=document.createRange（）
范围。选择节点（文本节点）
返回范围.getBoundingClientRect（）
}
不幸的是，DOM文本节点似乎没有offsetLeft/offsetTop属性。而且jQuery也不能很好地处理文本节点：我不知道如何为它们编写选择器表达式（尽管children（）不返回文本节点）！遗憾的是，在一个跨距中包装是在修改页面，因此文本节点不能使用meclientRects。我给了你+1作为giving，对我来说这是最好的答案。我已经证实这在铬中也有效。现在看来，它似乎得到了相当广泛的支持，因此我认为这应该是选择的答案。