根据偏移量（以像素为单位）查找 DIV 中的特定文本

Question

我想在文本块中插入一个图像标签，以便图像在 DIV 中向下 100 像素。

    <div>
    A lot of text in a text block and a <img tag> somewhere
that is floated left or right and positioned inside the text block
    </div>

因此，上面的标签被放置在要浮动的文本块中，使其位于 DIV 中的 100px DOWN 处。现在，这不能静态完成，必须在 javascript 中完成，因为 div 中向下 100px 可能由不同的文本表示，具体取决于字体渲染问题等。

那么，有没有办法在 DIV 中向下 100px 的文本块中找到什么“单词”？也许是 jQuery？

Answer 1

简短的回答是no

基本上归结为 DOM 并没有为您提供获取元素像素位置的方法。您可以对某些浏览器进行一些破解，但祝您解决方案正常工作。

如果无法获取包含 div 的位置，则无法获取其中文本的位置。

抛开no不谈，如果你想找到一种方法来获取 div 的像素高度，我会遵循类似于以下的过程。

1. 从 div 中获取文本并将其存储在本地变量中。
   1. 在文本中每个单词的循环内：
   2. 在单词前插入一个 div 标签。
   3. 获取div标签的像素位置。
   4. 使用它来确定最接近像素位置 100 下的单词。
2. 找到最近的位置后，创建一个文档片段来为 div 构建新的内部
3. 将 div 的内容替换为文档片段。