javascript显示多行文本

我尝试显示多行文字，但它始终显示为一行

例如：

var text ="line 1. \n line 2. \n line 3."

它应该显示为：

line 1.

line 2.

line 3.

但我却以

line 1. line 2. line 3.

在呈现的html页面中

我尝试了jquery文本和html方法，但不起作用

即使通过angularjs，它也总是一样的

$('#element').text(text);

$('#element').html(text);

or

<div>{{ text  }}</div>

$（“#元素”）.text（text）；
$（'#element'）.html（文本）；
或
{{text}}

难道没有办法达到我的期望吗？

试试类似的方法

<div class="angular-with-newlines">
    {{ text  }}
</div>

这将使用给定的换行符和空格，但也会在内容边界处打断内容。有关空白属性的更多信息，请参见：

如果要在换行符上打断，但同时收拢文本前面的多个空格或空白（与原始浏览器行为非常类似），可以使用：

white-space: pre-line;

---

可能是，这就是你想要的…

<textarea id="text"></textarea>
<p id="text2"></p>
<button onclick="multi_line_textarea()">on textarea</button>
<button onclick="multi_line_para()">on paragraph</button>


   <script>
            function multi_line_textarea(){
                var text = "line 1. \nline 2. \nline 3.";
                var el = document.getElementById('text');
                el.innerHTML = text;
            }
            function multi_line_para(){
                var text2 = "line 1. <br/>line 2. <br/>line 3.";
                var el2 = document.getElementById('text2');
                el2.innerHTML = text2;
            }
   </script>

关于文本区
关于段落
函数多行文本区域（）{
var text=“第1行。\n第2行。\n第3行。”；
var el=document.getElementById（'text'）；
el.innerHTML=文本；
}
函数multi_line_para（）{
var text2=“第1行。
第2行。
第3行。”；
var el2=document.getElementById（'text2'）；
el2.innerHTML=text2；
}

下面是一个JSFIDLE：

希望这有帮助。

像这样试试。

---

{{text}

尝试使用var text=“第1行.
第2行.
第3行.”和：$（“#元素”）.text（text）的可能副本；另一个可能的复制品：@bradley546994不起作用。在这种情况下，他们需要使用

.html（）

；使用css空白属性有效。谢谢。这是一个非常清晰的副本。你应该标记为关闭。另外，你应该避免使用性别专用词，因为可能是一位女性对你的帖子投了反对票。@FrankerZ对性别专用词感到抱歉，作为一名新手，我刚刚看到了这个问题并开始回答它，从下一次开始，我将确定这个问题是否重复

<textarea id="text"></textarea>
<p id="text2"></p>
<button onclick="multi_line_textarea()">on textarea</button>
<button onclick="multi_line_para()">on paragraph</button>


   <script>
            function multi_line_textarea(){
                var text = "line 1. \nline 2. \nline 3.";
                var el = document.getElementById('text');
                el.innerHTML = text;
            }
            function multi_line_para(){
                var text2 = "line 1. <br/>line 2. <br/>line 3.";
                var el2 = document.getElementById('text2');
                el2.innerHTML = text2;
            }
   </script>