在文档写入中创建新行 (JavaScript)答案

【问题标题】：Create new line in document write (JavaScript)在文档写入中创建新行 (JavaScript)
【发布时间】：2014-12-26 23:11:58
【问题描述】：

如何使 document.get 中的所有项目换行？我试过br/ 和\n。两者都不起作用。它们要么导致 JavaScript 运行不正确，要么不创建新行。我知道我可以将每一个都放在自己的段落元素中，但出于我的目的，我必须将它们全部放在一个段落元素中。

<script type="text/javascript">
<!--
    var     firstString =  prompt(" Enter the first number ", "");
    var     secondString = prompt(" Enter the second number ", "");
    var     num1 = parseFloat(firstString);
    var     num2 = parseFloat(secondString);

    var addition = num1 + num2;         //  Addition of num1 and num2
    var subtraction = num1 - num2;      //  Subtraction of num1 and num2
    var multiplication = num1 * num2;   //  Multiplication of num1 and num2
    var division = num1 / num2          //  Division of num1 and num2

    //These are the ones I'm trying to get to appear on separate lines

    document.write (
        "<p> First Value Entered: " + num1 + \n
        "Second Value Entered: " + num2 + \n
        "Sum: " + addition + \n
        "Difference: " + subtraction + \n
        "Product: " + multiplication + \n
        "Quotient: " + division + "</p>"
    );
// -->
</script>

【问题讨论】：

不要使用document.write，它是在我们拥有 DOM 操作函数之前的古老 JS API 的一部分，永远不应该使用（它很危险：it really doesn't do what you think it does）。用document.createElement创建你的东西，用.textContent=...设置它们的内容（不是.innerHTML，因为那只是更多的DOM内容，就这样创建）然后用document.body.appendChild(...)/element.appendChild(...)将它添加到DOM中跨度>
是的，我知道，这是作业的标准-_-
你需要和分配它的人谈谈。这不是正确的 HTML+JS，而且已经很多年没有了。
为什么不用
```
这里的文字\n更多文字
```
？

标签： javascript html newline line-breaks

【解决方案1】：

你需要：

引用所有字符串文字
在要连接的每对对字符串之间放置一个+
使用 <br> 元素代替文字换行（因为 HTML 中的换行不会导致呈现换行符）

这样的：

"Second Value Entered: " + num2 + "<br>" +

也就是说，这看起来更像是dl/dt/dd 的工作，而不是其中包含换行符的段落。

【讨论】：

像魅力一样工作谢谢！

【解决方案2】：

将\n 放在引号中，例如："\n"，并且不要忘记在它们后面加上加号。这是一个大的串联字符串。

ETA：如另一个答案中所述，纯 HTML 不支持换行符，因此请使用 <br>!

【讨论】：

它试图像变量或关键字一样评估\n，你想要一个字符串。
不，它会呈现为换行符，如果你真的想呈现\n，你必须像这样转义斜线："\\n"
嗯，你是对的，它只在转义时呈现，但\n 只能在outer/innerHTML 中看到，它不会为页面创建新行。跨度>
啊，确实。我习惯于更新支持它的字段和其他元素。在纯 HTML 中，<br> 是您的解决方案。

【解决方案3】：

<!DOCTYPE html>
<!-- JavaScript Arith - Oct. 22, 1918 -->

var name = prompt("Hello and Welcome! I'm Chip. We're going to play a little math game. What's your name?", "");

    alert("Hello, " + name + ". Please enter a number for each prompt. Please, do not use 0 for either number.")

    var answer, sum, difference, product, quotient, power = -1; // Initialize 
    // Input - Prompt for the numbers

    // Processing - the preparation for number crunching        

    // Make sure the values are numeric.var first = Number(prompt("Enter the first number", ""));       
    var first = Number(prompt("Enter the first number", ""));
    var second = Number(prompt("Enter the second number", ""));

    // Output - results 
    // Feedback - later for errors, e.g., 0, letters, etc.
    document.write(name + ", the numbers chosen were: " + first + " and " + second);

    document.write(".<br>The results are shown below.<ul>");

    var sum = first + second;
    document.write("<li>Sum: " + sum + "</li>"); // ad d

    var difference = first - second;
    document.write("<li>Difference: " + difference + "</li>"); // subtract
    /*
    M, S and D. For positive arguments M and S holds:
    The minuend (M) is the first number in a subtraction; the number from which another number (the Subtrahend) is to be subtracted.
    The subtrahend (s) is the number that is being subtracted from the minuend.
    Minuend.
    Example: in 8 − 3 = 5, 8 is the minuend (M). 3 is the subtrahend (S). 5 is the difference (D).
    If the minuend is larger than the subtrahend, the difference D is positive.
    If the minuend is smaller than the subtrahend, the difference D is negative.
    In any case, if minuend and subtrahend are equal, the difference D = 0.
    */

    var product = first * second;
    document.write("<li>Product: " + product + "</li>");    // multiply
    /* factors */

    var quotient = first / second;
    document.write("<li>Quotient: " + quotient + "</li>");  // divide
    /*
    Division shows the relationship between the dividend, divisor, quotient and remainder. The number which we divide (before  the '/' operator) is called the 'dividend.' The number by which we divide (after the '/' operator)is called the 'divisor.' The result obtained is called the 'quotient.'
    */

    var power = first ** second;
    document.write("<li>Power: " + power + "</li>");    // exponentiation

    document.write("</ul>Thanks, " + name + ". Have a Nice Day!");

【讨论】：

将以上内容放在html文件的标签中。使用

【解决方案4】：

document.write("\n");

document.write("<br>");

【讨论】：

【解决方案5】：

 function breakline()
       {
            document.write("Hi?<br> nice shirt");
            // "<br>" use in document.write
         
            alert("Hi? \n nice shirt");
            // '/n' use in alert 
       }
       
       breakline();

【讨论】：

你能解释一下为什么你的答案解决了这个问题吗？