javascript - 如何在此 javascript 命令中添加换行符

标签 javascript html

好吧,我有一个脚本可以像这样输出数组

document.getElementById("message").innerHTML = msg;

我得到的结果是

line1 line2 line3 line4

我希望它是这样的

line1
line2
line3
line4

我尝试在不同的地方添加,但就是无法让它工作

我的完整代码

<html>
<head>
<script type="text/javascript">
function textareaToArray(t){
return t.value.split(/[\n\r]+/);
}
function showArray(a){
var msg="";
for(var i=0;i<a.length;i++){
msg+= a[i]+"\n";
}

document.getElementById("message").innerHTML = msg.join("</br>");

}
</script>
</head>
<title>
Welcome To ....
</title>
<body>
<center><h1> WELCOME TO .... </h1></center>
</br>
</br>
</br>
<center><form>
<textarea rows="7" cols="60" name="alpha"></textarea>
<br>
<input type="button"
value="show array"
onclick="showArray(textareaToArray(this.form.alpha ))">
</form></center>
</br>
<div id="message"></div>
</body>
</html>

最佳答案

您可以使用join() :

document.getElementById("message").innerHTML = msg.join('<br>');

jsfiddle

根据OP的评论进行编辑

使用 join 时不需要循环遍历数组:

working jsfiddle

function textareaToArray(text){
    return text.value.split(/[\n\r]+/);
}

function showArray(msg){
    document.getElementById("message").innerHTML = msg.join("<br/>");
}

此外,您还没有指定文档类型...这非常重要。 对于 HTML5,请使用 <!DOCTYPE html> .

关于javascript - 如何在此 javascript 命令中添加换行符,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21727981/

相关文章:

javascript - 如何将多维数组转换为二维数组?

javascript - 在 laravel 6.x 中渲染多个 vue 组件

javascript - 如何在 Bootstrap 下拉菜单上编辑 CSS?

javascript - 可折叠的 CSS 和 JS 在 Angular 应用程序中不起作用

javascript - 如何使用onChange()函数进行排序?

javascript - 如何仅从 Angular Js中的MySQL数据库日期戳中获取日期

javascript - 如何制作列数未知且每列大小相等的网格布局?

html - 覆盖按钮不可点击

html - 响应式下拉菜单无法在两列 View 中正确打开

jquery - 具有自定义背景图像的可变高度 div - 最好的技术是什么?