从数组中加入字符串并将其呈现在 div 中后如何创建换行符？

Question

我有以下数组：

results = ["Dog","Cat","Fish","Parrot"];

我使用如下.join方法加入它：

var finalResult=results.join("\n");

我有一个div：

Validation Result:<div id="result"></div>

然后我尝试将其渲染为div如下所示：

this.shadowRoot.getElementById('result').textContent = finalResult;

这最终会在每个单词之间呈现一个空格：

狗猫鱼鹦鹉

我希望它将每个字符串粘贴到一个新行上，如下所示：

狗

猫

鱼

鹦鹉

我似乎无法实现这一目标。关于如何实现这一目标的任何建议？

Answer 1

使用<br>代替\n将解决您的问题。

也许你可以尝试如下：

const results = ["Dog","Cat","Fish","Parrot"];
const div = document.getElementById('elements');
div.innerHTML = results.join('<br>');

<div id="elements"></div>

推荐阅读的文章：

1. 元素.innerHTML
2. <br>: Line Break 元素

我希望这有帮助！