我有一些javascript代码从用户那里获取一些数据然后输出均值和其他统计数据作为document.write。我希望它输出到同一页面。这是代码：
<!DOCTYPE html>
<html>
<head>
<script>
function statisticsCalc() {
var count = 0;
var sum = 0;
var average = 0;
var min = 99999999;
var max = -99999999;
var num = prompt("Enter a number, or enter a blank to end");
while (num != "") {
count++;
num = Number(num);
sum += num;
if (num < min) {
min = num;
}
if (num > max) {
max = num;
}
num = prompt("Enter a number, or enter a blank to end");
}
var average = sum / count;
Math.round(average * 100) / 100;
document.write("You entered " + count + " numbers." + "<br>" + "<br>");
document.write(" The smallest number was " + min + ", and the largest number was " + max + "." + "<br>" + "<br>");
document.write(" The difference between the max and min was " + (max - min) + "." + "<br>" + "<br>");
document.write(" The sum of the entries was " + sum + "." + "<br>" + "<br>");
document.write(" The average number was " + average + "." + "<br>" + "<br>");
}
</script>
<style>
ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: #333;
}
li {
float: left;
}
li a {
display: block;
color: white;
text-align: center;
padding: 14px 55px;
text-decoration: none;
}
li a:hover {
background-color: #111;
}
.tasks {
color: white;
font-size: 250%;
text-align: center;
}
</style>
</head>
<body background="wallpaper.png">
<ul>
<li><a class="active" href="index_page.html">Home</a>
</li>
<li><a href="task1.html">Task 1</a>
</li>
<li><a href="task2.html">Task 2</a>
</li>
<li><a href="task3.html">Task 3</a>
</li>
<li><a href="task4.html">Task 4</a>
</li>
<li><a href="task5.html">Task 5</a>
</li>
<li><a href="task6.html">Task 6</a>
</li>
<li><a href="task7.html">Task 7</a>
</li>
</ul>
<div class='tasks'>
<div class='container'>
<h1>Task 6</h1>
<h3> Enter some numbers, when your finished enter a blank </h3>
<button onclick="statisticsCalc()">Go</button>
<p id="ValueAnswer"></p>
</div>
</div>
</body>
</html>
非常感谢
詹姆斯
答案 0 :(得分：0)
不要直接使用document.write，您可以使用document.createElement('p')创建一个新元素并附加到您的文档。
答案 1 :(得分：0)
<!DOCTYPE html>
<html>
<head>
<script>
function statisticsCalc() {
var count = 0;
var sum = 0;
var average = 0;
var min = 99999999;
var max = -99999999;
var num = prompt("Enter a number, or enter a blank to end");
while (num != "") {
count++;
num = Number(num);
sum += num;
if (num < min) {
min = num;
}
if (num > max) {
max = num;
}
num = prompt("Enter a number, or enter a blank to end");
}
var average = sum / count;
Math.round(average * 100) / 100;
var result_html = "";
result_html += "You entered " + count + " numbers." + "<br>" + "<br>";
result_html += " The smallest number was " + min + ", and the largest number was " + max + "." + "<br>" + "<br>";
result_html += " The difference between the max and min was " + (max - min) + "." + "<br>" + "<br>";
result_html += " The sum of the entries was " + sum + "." + "<br>" + "<br>";
result_html += " The average number was " + average + "." + "<br>" + "<br>";
document.getElementById("ValueAnswer").innerHTML = result_html;
}
</script>
<style>
ul {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: #333;
}
li {
float: left;
}
li a {
display: block;
color: white;
text-align: center;
padding: 14px 55px;
text-decoration: none;
}
li a:hover {
background-color: #111;
}
.tasks {
color: white;
font-size: 250%;
text-align: center;
}
#ValueAnswer{
color:#000;
}
</style>
</head>
<body background="wallpaper.png">
<ul>
<li><a class="active" href="index_page.html">Home</a>
</li>
<li><a href="task1.html">Task 1</a>
</li>
<li><a href="task2.html">Task 2</a>
</li>
<li><a href="task3.html">Task 3</a>
</li>
<li><a href="task4.html">Task 4</a>
</li>
<li><a href="task5.html">Task 5</a>
</li>
<li><a href="task6.html">Task 6</a>
</li>
<li><a href="task7.html">Task 7</a>
</li>
</ul>
<div class='tasks'>
<div class='container'>
<h1>Task 6</h1>
<h3> Enter some numbers, when your finished enter a blank </h3>
<button onclick="statisticsCalc()">Go</button>
<p id="ValueAnswer"></p>
</div>
</div>
</body>
</html>