我可以在自动换行的 contenteditable div-tag 中获得“换行符”吗？答案

【问题标题】：Can I get the 'line breaks' in a contenteditable div-tag that's word-wrapping?我可以在自动换行的 contenteditable div-tag 中获得“换行符”吗？
【发布时间】：2025-11-30 23:45:03
【问题描述】：

我正在使用 nicedit，它使用 contenteditable DIV 标记作为输入字段，在用户可以输入和格式化一些文本的页面上，然后将其提交给 php 脚本，该脚本将此格式化的文本转换为图像. 此 contenteditable div 中的文本被自动换行，其中没有换行符。
有没有办法找出这种换行发生的位置，或者在发生时插入换行符，以便我可以将文本作为单独的行访问？

【问题讨论】：

标签： javascript nicedit

【解决方案1】：

您必须计算每个单词的像素坐标，这对于实现跨浏览器是可能的，但并非易事。一种方法是在每个单词之前插入一个零宽度的虚拟元素并使用它的位置。最近的 WebKit 和 Firefox 浏览器为您提供了 DOM Range 对象的getClientRects() 方法，这种方法更可取，因为它侵入性较小并且可能性能更好。 IE 专有的TextRange 对象具有在单词和属性boundingLeft 和boundingTop 之间移动的方法，这将为您提供TextRange 的边界框。

【讨论】：

【解决方案2】：

尝试不同的方法，改变渲染图像的方式。也许您可以找到一个自动处理自动换行的图形库，或者复制页面上的 HTML 并使用PhantomJS 或类似的方法拍摄快照。

【讨论】：