如何高效提取浏览器自动换行后的文本内容？
在网页开发中，我们经常遇到这种情况：一段文本在<p></p>标签内显示，虽然代码中没有明确的换行符(<br>)，但浏览器会根据容器宽度自动换行。 如果需要获取每行文本，该如何操作呢？本文将提供一种解决方案。
问题：一段包含图片的文本，浏览器自动换行显示，直接获取<p></p><div class="aritcle_card flexRow">
<div class="artcardd flexRow">
<a class="aritcle_card_img" href="/xiazai/skill8291" title="page-agent 浏览器控制（CDP）"><img
src="https://img.php.cn/upload/skill/000/000/081/179196125775037.jpg" alt="page-agent 浏览器控制（CDP）" ></a>
<div class="aritcle_card_info flexColumn">
<a href="/xiazai/skill8291" title="page-agent 浏览器控制（CDP）">page-agent 浏览器控制（CDP）</a>
<p>使用 page-agent CLI（CDP）控制浏览器；CLI只能通过 GitHub Release 的 .tgz 安装，npm 官方包暂未发布。</p>
</div>
<a href="/xiazai/skill8291" title="page-agent 浏览器控制（CDP）" class="aritcle_card_btn flexRow flexcenter"><b></b><span>下载</span> </a>
</div>
</div>标签文本无法获得每行文本，因为源代码中没有换行符。
解决方案：基于容器宽度进行文本分割。
我们可以通过JavaScript获取<p></p>标签的宽度以及每个字符的宽度（需考虑字体等因素）。然后，根据容器宽度计算每行可容纳的字符数，利用字符串截取函数将文本分割成多个子字符串，每个子字符串代表一行文本。 为了避免单词截断，可以考虑在单词边界进行分割。 当然，这种方法需要考虑字体、字号等因素对字符宽度的影响，以保证分割准确性。 目前尚无其他通用的方法可以直接解决这个问题。
