如何在数组中为每个字符串添加换行？HTML/JavaScript技术疑问

核心问题在于你混淆了文本换行符\n和HTML换行标签<br>：浏览器不会把\n解析为页面换行，只会当作空白字符；同时直接输出数组会默认转为逗号分隔的字符串，达不到每行一个的效果。结合你目前仅学过基础数组和基础语句的情况，给你两种简单可行的实现方案：

方法1：用数组join()方法（简洁高效） #

修改排序后的输出逻辑，用<br>连接数组元素后再输出：

<!DOCTYPE html>
<html>
<body>
<h2> Assignment 1 - Task 4: 5 Student List </h2>

<p id="task 4"></p>

<script>
var Student1 = prompt("Enter the student's name");
document.write(" Student 1: " + Student1);
document.write("<br>");

var Student2 = prompt("Enter the student's name");
document.write(" Student 2: " + Student2);
document.write("<br>");

var Student3 = prompt("Enter the student's name");
document.write(" Student 3: " + Student3);
document.write("<br>");

var Student4 = prompt("Enter the student's name");
document.write(" Student 4: " + Student4);
document.write("<br>");

var Student5 = prompt("Enter the student's name");
document.write(" Student 5: " + Student5);
document.write("<br>");

document.write("<br>");
document.write( "The sorted list:" );
document.write("<br>");

// 仅存储学生姓名，无需提前加换行符
var studentList = [Student1, Student2, Student3, Student4, Student5];
studentList.sort();

// 用join将数组元素用<br>连接，实现每行一个姓名
document.write(studentList.join("<br>"));
</script>

</body>
</html>

方法2：逐个输出数组元素（贴合基础知识点） #

如果你还没接触过join()，可以直接逐个输出排序后的数组元素，每个元素后追加<br>：

<!DOCTYPE html>
<html>
<body>
<h2> Assignment 1 - Task 4: 5 Student List </h2>

<p id="task 4"></p>

<script>
var Student1 = prompt("Enter the student's name");
document.write(" Student 1: " + Student1);
document.write("<br>");

var Student2 = prompt("Enter the student's name");
document.write(" Student 2: " + Student2);
document.write("<br>");

var Student3 = prompt("Enter the student's name");
document.write(" Student 3: " + Student3);
document.write("<br>");

var Student4 = prompt("Enter the student's name");
document.write(" Student 4: " + Student4);
document.write("<br>");

var Student5 = prompt("Enter the student's name");
document.write(" Student 5: " + Student5);
document.write("<br>");

document.write("<br>");
document.write( "The sorted list:" );
document.write("<br>");

var studentList = [Student1, Student2, Student3, Student4, Student5];
studentList.sort();

// 逐个输出每个姓名，每个后面加换行标签
document.write(studentList[0] + "<br>");
document.write(studentList[1] + "<br>");
document.write(studentList[2] + "<br>");
document.write(studentList[3] + "<br>");
document.write(studentList[4] + "<br>");
</script>

</body>
</html>

你之前尝试失败的原因 #

• 错误给数组添加\n：\n在HTML中不生效，且像Student1\n这种写法属于语法错误，换行符必须放在引号内作为字符串使用；
• 直接输出数组：数组会被默认转换为逗号分隔的字符串，自然不会换行。

只要记住：在HTML页面中实现换行必须用<br>标签，通过连接数组元素或逐个输出时追加该标签，就能实现每行一个姓名的效果。

内容的提问来源于stack exchange，提问作者HaqM