如何通过JavaScript获取文本的第n行？

将一个简单的html元素视为

<div id="test">
a long text without line break
</div>

<pre>hello
hello1
hello2</pre>

没有换行符的长文本

浏览器将根据字形和字体大小创建线条。通过浏览器排列文本后（例如，取决于窗口宽度），如何通过JavaScript获取文本行

例如：

如何获取总行数

如何获取当前窗口中显示的第一行

第n行怎么走

---

不，没有API允许您在布局发生后访问呈现的文本。唯一的近似方法是非常粗糙的，也就是说，将单词一次添加到一个容器中，然后查看它何时改变高度。见这一相关问题：

---

是的，谁会想到，即使jQuery也不会这么做！；-）

2个简单的解决方案和一个极其困难的解决方案。

1格式化文本

在pre&textContent中

html

---

2添加br

在包含br&textContent的div中

html

html

查找行数的简单方法，但需要计算文本宽度才能找到相应的行内容

---

我试图设置第一行文本的样式，但文本转换：大写将其搞糟。有助于解决第一行问题（响应！），因此此库可能也会帮助解决您的问题。

行的组成部分是什么？我怀疑2和3是否可以解决。@我们目前在屏幕上看到的问题！浏览器为显示长文本而创建的行。我想知道浏览器是如何排列这些行的，现在我自己打断了这些行。是的，我明白。但这背后有很多工作。我在2-3个答案中谈到了这一点。。。你想做什么几乎是不可能的。这些答案更多地讨论了文本格式。但关键是你无法控制浏览器的格式。每个浏览器都是不同的。唯一的方法是计算所有内容。第三种解决方案是你问题的基本答案。1.获得行高，2.计算每个单词的宽度，并将其添加到新元素中，3.如果宽度大于最大宽度，则创建新元素（线）。。。等等

document.getElementsByTagName('pre')[0].textContent.split('\n')

<div>hello<br>hello1<br>hello2<br>pizza</div>

document.getElementsByTagName('div')[0].innerHTML.split('<br>')

div{width:100px;line-height:20px;}

<div>hello dfgfhdhdgh fgdh fdghf gfdh fdgh hello1gfhd gh gh dfghd dfgh dhgf gf g dgh hello2</div>

document.getElementsByTagName('div')[0].offsetHeight/20