HTML 如何在HTML文本区域中添加换行符

要在HTML文本区域中添加换行符，我们可以使用HTML换行符标签在我们想要的地方插入一个换行符。另外，我们也可以使用CSS属性 “white-space: pre-wrap “来自动给文本添加换行符。在文本框中显示预先格式化的文本时，这一点特别有用。因此，我们来讨论一下添加换行符的方法。

方法

在HTML中创建一个textarea，并为其分配一个id。
创建一个按钮，当点击该按钮时，将使用换行符分割该文本区的文本。
现在创建一个函数，将文本分割成换行。这个函数的代码将是 —

function replacePeriodsWithLineBreaks() {
   // Get the textarea element
   var textarea = document.getElementById("textarea");

   // Get the text from the textarea
   var text = textarea.value;

   // Replace periods with line breaks
   text = text.replace(/\./g, "  
");

   // Update the textarea with the new text
   textarea.value = text;
}

例子

这种方法的最终代码将是 –

<!DOCTYPE html>
<html>
<head>
   <title>Add Line Breaks</title>
</head>
   <body>
      <textarea id="textarea" rows="10" cols="50"></textarea>
      <br>
      <button id="replace-btn" onclick="replacePeriodsWithLineBreaks()">Replace Periods with Line Breaks</button>
      <script>
         // Function to replace periods with line breaks in the textarea
         function replacePeriodsWithLineBreaks() {
            // Get the textarea element
            var textarea = document.getElementById("textarea");

            // Get the text from the textarea
            var text = textarea.value;

            // Replace periods with line breaks
            text = text.replace(/\./g, "  
");

            // Update the textarea with the new text
            textarea.value = text;
         }
      </script>
   </body>
</html>