How do I make all of the items inside document.get on new lines? I've tried br/ and \n. Neither of which work. They either cause the JavaScript to run incorrectly or don't create new lines. I know I can put each in its own paragraph element but for my purposes I have to have it all in one paragraph element.
<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>
How do I make all of the items inside document.get on new lines? I've tried br/ and \n. Neither of which work. They either cause the JavaScript to run incorrectly or don't create new lines. I know I can put each in its own paragraph element but for my purposes I have to have it all in one paragraph element.
<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>
5 Answers
Reset to default 6Put \n in quotes, like so: "\n", and don't forget to put plus signs after them too. It's one big concatenated string.
ETA: As mentioned in the other answer, pure HTML doesn't support newlines, so use <br>!
You need to:
- quote all your string literals
- put a
+between each pair of strings you want to concatenate - use a
<br>element instead of a literal new line (since a new line in HTML doesn't cause a line break to be rendered)
Such:
"Second Value Entered: " + num2 + "<br>" +
That said, this looks more like a job for dl/dt/dd than a paragraph with line breaks in it.
<!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!");
document.write("\n");
document.write("<br>");
function breakline()
{
document.write("Hi?<br> nice shirt");
// "<br>" use in document.write
alert("Hi? \n nice shirt");
// '/n' use in alert
}
breakline();
document.write, it's part of an ancient JS API from before we had DOM manipulation functions and should never be used (and it's dangerous: it really doesn't do what you think it does). Create your stuff withdocument.createElement, set their content with.textContent=...(not.innerHTML, because that's just more DOM content, create it as such) and then add it to the DOM withdocument.body.appendChild(...)/element.appendChild(...)– Mike 'Pomax' Kamermans Commented Oct 30, 2014 at 18:48