如何在javascript变量上添加换行符

Question

非常简单的问题，无法解决。 我正在尝试在表格标题上添加换行符

var text = "<table id='test' class='test'>";
    text += "<tr><th> style='font-size:16px'>Cool \nStuff</th></tr>";

我尝试使用<br>和\\n添加换行符，但不走运，有人可以帮我吗

Answer 1

\\n在字符串中放置换行符，但是HTML将换行符视为空格。 要设置换行符，您：

1. 使用<br> （“ break”）元素：

    var text = "<table id='test' class='test'>"; text += "<tr><th style='font-size:16px'>Cool<br>Stuff</th></tr>"; 

   要么，

2. 将第一行放在一个块元素中，第二行放在另一个块元素中：

    var text = "<table id='test' class='test'>"; text += "<tr><th style='font-size:16px'>" + "<div>Cool</div>" + "<div>Stuff</div>" + "</th></tr>"; 

之类的东西。

Answer 2

使用<br>应该可以正常工作。 注意：你有没有和开口的错字th

 var text = "<table id='test' class='test'>"; text += "<thead>"; text += "<tr><th style='font-size:16px'>Cool <br/>Stuff</th></tr>"; text += "</thead>"; text += "</table>"; document.getElementById("z").innerHTML = text; 

 <div id="z"></div> 

Answer 3

添加</br>应该可以，请参见下面的代码段。 请注意，您的HTML中有错误。 <th> style='font-size:16px'>包含两个结束>标记，您应该删除第一个。

 var text = "<table id='test' class='test'>"; text += "<tr><th style='font-size:16px'> Cool </br> Stuff</th></tr>"; document.write(text) 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 

Answer 4

将标题中的每一行分隔为<span>Cool</span><span>Stuff</span>并在span中添加以下样式：

span {
    width: 100%;
    display: block;
}

例：

 // using your javascript example... var text = "<table id='test' class='test'>"; text += "<tr><th> style='font-size:16px'><span style='width:100%; display:block;'>Cool</span><span style='width:100%; display:block;>Stuff</span></th></tr>"; 

 .table { width: 100%; display: block; } .table > thead > tr > th { padding: 15px; text-align: center; border: solid 2px #d2d2d2; background-color: #000000; color: #ffffff; } .table > thead > tr > th > span { width: 100%; display: block; } 

 <table class="table"><!-- START TABLE --> <thead> <tr> <th><span>Cool</span><span>Stuff</span></th> <th>Column 2</th> <th>Column 3</th> <th>Column 4</th> </tr> </thead> <tbody class="tbody"> </tbody> </table><!-- /END TABLE --> 

Answer 5

使用<br>效果很好。

(function () {
    text += '<th>Cool<br>Stuff</th>';
})();

相关的JSFiddle

Answer 6

http://jsfiddle.net/68Lc0d7t/1/

您错过了<th>标记中的结束标记。.上面是使用<br>标记的简单工作方式。