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

Question

我想将一个图像标签插入到一个文本 block 中，以便图像在 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>

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

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

Answer 1

简短的回答是 no

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

如果您无法获得包含 div 的位置，您将无法获得其中文本的位置。

撇开 no ，如果您要找到获取 div 像素高度的方法，我会遵循类似于以下的过程。

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