如何在打字机效果中换行？

Question

我的 #effect 有 JavaScript 打字效果，我希望在 [=] 中使用 \n 的地方换行输入文本14=]变量，但整个文本只是连续输入，不管我在某些地方声明了\ns，

如何让我的 textEffect 输入新行？

let x = 0;
let textEffect = "Hi, \n I'm Dorothy, \n\ have a good day!";
let container = document.getElementById("effect");

function animate() {
    if(x < textEffect.length){
        container.innerHTML += textEffect.charAt(x);
        x++;
        setTimeout(animate, 80);
    }
}
animate();

<div id="effect"></div>

Answer 1

需要样式white-space: pre-line;。

let x = 0;
let textEffect = "Hi, \n I'm Dorothy, \n\ have a good day!.";
let container = document.getElementById("effect");

function animate() {
    if(x < textEffect.length){
        container.innerHTML += textEffect.charAt(x);
        x++;
        setTimeout(animate, 80);
    }
}
animate();

<div id="effect" style="white-space: pre-line;"></div>

如何在打字机效果中换行？

How to go to new line in Type Writer effect?

javascript

text

newline

effects