Question

我想在div中创建一个新段落：

我想在段落中使用新行。我正在使用\ n来逃避它们，但它们正在创建新行。我做错了什么？

var oNewP = document.createElement("p");
var oText = document.createTextNode("Harry Huy\nPresident\n283.423.6431\nharry.huy@hello.com");
oNewP.appendChild(oText);
document.body.appendChild(oNewP);

var Test = document.getElementById('Test');
Test.appendChild(oNewP);

http://jsfiddle.net/4qvydycf/4/

Answer 1

文本中的新行通常不会在HTML文档中创建新行。您使用JavaScript并不重要。结果与......相同。

<p>Harry Hun
President

HTML中的

...新行被视为任何其他空格（新行，制表符，空格）字符。

您可以像在HTML中一样处理此问题。之一：

在

br

使用CSS white-space属性
默认使用应用white-space属性的元素（如pre）。

Answer 2

\n不是HTML元素，而是使用<br />元素。但是createTextNode不会将文本呈现为HTML，因此您需要执行以下操作：

var Test = document.getElementById('Test');
Test.appendChild(document.createTextNode("Harry Huy"));
Test.appendChild(document.createNode('br'));
Test.appendChild(document.createTextNode("President"));
Test.appendChild(document.createNode('br'));
Test.appendChild(document.createTextNode("283.423.6431"));
Test.appendChild(document.createNode('br'));
Test.appendChild(document.createTextNode("harry.huy@hello.com"));

Answer 3

只需使用标记pre，然后将段落与\ n连接起来即可，如下所示：

    var oNewP = document.createElement("pre");
    var oText = document.createTextNode("Harry 
Huy\nPresident\n283.423.6431\nharry.huy@hello.com");
    oNewP.appendChild(oText);
    document.body.appendChild(oNewP);

    var Test = document.getElementById('Test');
    Test.appendChild(oNewP);

createTextNode中的新行

3 个答案: