如何在文本节点中创建换行符

Question

我有这段代码，我希望文本节点 t 有一个换行符（开始一个新行）。但是没有添加换行符:(

请帮忙...

// Create a new list item when clicking on the "Add" button
function newElement() {
    var li = document.createElement("li");
    var inputText = document.getElementById("myInput").value + document.createElement("br") + "ddd" ;
    var t = document.createTextNode(inputText); // this text node is supposed to have a linebreak
    li.appendChild(t);
    li.value = document.getElementById("myValue").value;
    if (inputText === '') {
        alert("You must write something!");
    } else {
        updateLI(li);
        document.getElementById("myUL").appendChild(li);
    }
    document.getElementById("myInput").value = "";
    document.getElementById("myValue").value = "";
}

Answer 1

这里的主要问题是文本节点不能包含任何其他元素，而您正试图向其中添加一个 br 元素。您需要的是：

function newElement() {
    var li = document.createElement("li");
    var inputText = document.getElementById("myInput").value;
    li.appendChild(document.createTextNode(inputText));
    li.appendChild(document.createElement("br"));
    li.appendChild(document.createTextNode("ddd"));

    ...

请记住，向文本节点添加 \n 字符也无济于事，因为 html "converts" 全白-space 到单个 space 符号 - 也就是说，除非您使用 white-space: pre; CSS 应用于您的元素（这是解决您的问题的另一种选择）。

如何在文本节点中创建换行符

How to create a newline in Text Node

javascript

textnode