我可以使用JavaScript中的浏览器自动换行吗？

我在div中有一些文字.它可以是阳光下的任何Unicode文本,包括中文,日文和韩文.现在,我需要以一些有效但正确的方式使用此文本并在JavaScript中自动换行.然后我需要插入一个“>”在每一行的开头,将生成的文本放入textarea.

浏览器具有Unicode Word Wrap算法的实现,正如在CSS中使用自动换行的Unicode文本所证明的那样. (至少,Firefox有这样的算法,我怀疑其他浏览器也这样做.)我需要的是JavaScript使用相同的自动换行算法的一些方法,这样我就可以正确地换行然后“引用”Unicode文本.

JavaScript是否有任何方法可以使用浏览器的自动换行算法,或者知道文本在div或任何其他元素中的换行位置？

解决方法:

你真正想要的不一定是插入“>”在每行开头的流动文本中.你真正想要的是给定块中的每一行都有一个“>”在它的左边.

您可以通过以下方式执行后者：

1)创建“>”的图像字符,其高度从上到下等于您计划使用的CSS行高值.将该图像作为背景应用于要“插入”的文本的容器中.让它垂直重复,但不是水平重复.将容器填充为字符/图像的宽度.

2)让一些javascript获取你正在使用的容器的line-height属性的计算值.然后,假设您没有人为地设置此容器的高度,容器中文本的“行”数是其offsetHeight除以计算的行高.此时,创建一个单独的容器,其中只有>的内容.将其放置在内容容器的左边缘.

关于您是否可以访问浏览器通过JavaScript使用的文本流算法的更大问题是一个有趣的问题,但我很确定答案是否定的.然而,随着越来越多的开发人员开始使用Canvas元素,人们正在自己编写(Canvas有文本绘图,但没有自己的文本流布局算法).你可能想看看Bespin的人做了什么(https://bespin.mozillalabs.com/ – 它是使用Canvas实现的文本编辑器)或查看一些沙袋/图像文本包装javascript库的来源,如jQSlickWrap(http://jwf.us/projects/jQSlickWrap/).

标签：javascript,browser,word-wrap
来源： https://codeday.me/bug/20190705/1384325.html