JavaScript忽略了文本的最后一排破裂。（Elem.val（））

Question

我正在尝试将文本方面的值输出到PRE（或带有白空间的Div：pre on to Chip）中。一切都很好，但是它跳过了最后的线路破裂。因此，如果添加文本和线路破坏，它将不会显示线路破坏。如果添加文本和两个线路断开，它将显示文本和一个线路断开。 因此，看起来文本正在修剪。 谁能建议为什么会发生这种情况以及如何解决？

function starter(e) {
  $("#output").text(e);
}

$('#textin').on('input',function(){
  starter($('#textin').val())
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<textarea id="textin"></textarea>
<pre id="output" style="border:1px solid black"></pre>

Answer 1

我在阅读后找到了答案
在段落中时忽略了元素？。

浏览器会休息一段时间，而不是“线路结束”。

考虑到这一点；这个半十分的技巧可以完成这项工作，增加了一个额外的线路休息：

function starter(e) {
  $("#output").text(e+'\n');
}

Answer 2

最简单的解决方案是简单地将您插入文本插入以下CSS属性中的元素进行样式：

white-space: pre-wrap;

此属性会导致匹配元素中的空格和新线的处理方式与＆lt; textarea＆gt;中的方式相同。也就是说，连续的白道不会崩溃，并且在显式新线时断开线（但如果超过元素的宽度，也会自动包装）。