Javascript用回车分隔字符串答案

【问题标题】：Javascript separate string with enterJavascript用回车分隔字符串
【发布时间】：2020-02-11 03:13:27
【问题描述】：

我想将 html 脚本放在 <div id> 中，但我不能用 enter 分隔字符串。所以我把代码写成这样（例子）：

var html = "<table style='width:100%'><tr><th>Firstname</th><th>Lastname</th><th>Age</th></tr>";

$("#panelChatlog").html(this.html);

如你所见，字符串是 html 代码，但我想将 html 代码分开，这样它更具可读性：

var html = "
          <table style="width:100%">
            <tr>
              <th>Firstname</th>
              <th>Lastname</th>
              <th>Age</th>
            </tr>
        ";

$("#panelChatlog").html(this.html);

但这在我的 javascript 中是不可能的。我正在使用 processmaker 3.x 有什么建议吗？

【问题讨论】：

将 $("#panelChatlog").html(this.html); 更改为 $("#panelChatlog").html(html);。那是 var 不是类或构造函数属性。这些实际上是完全不同的，因为浏览器将一个或多个空格解释为单个空格。这可能适用于表格，但不会呈现相同的效果。
另外，你必须在引号中使用不同的引号，或者转义你的引号，或者使用模板文字。

标签： javascript processmaker

【解决方案1】：

使用 ` 字符，如 @Christian 和用户修剪功能从 HTML 代码中删除空格。

var html = `
          <table style="width:100%">
            <tr>
              <th>Firstname</th>
              <th>Lastname</th>
              <th>Age</th>
            </tr>
        `;

 $("#panelChatlog").html(html.trim());

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.2.3/jquery.min.js"></script>
<div id="panelChatlog">
  
</div>

【讨论】：

【解决方案2】：

这就是引入 ` 字符的目的，因此您无需在字符串中手动写入 \n。只需替换引号就足够了（确保关闭您的 table 标签）：

var html = `
          <table style="width:100%">
            <tr>
              <th>Firstname</th>
              <th>Lastname</th>
              <th>Age</th>
            </tr>
          </table>
        `;

alert(html);

【讨论】：

每个人都有相同的答案，我不能选择超过1个答案，但感谢所有回答我的人。

【解决方案3】：

您可以使用 ES6 中引入的template literals。

const htmlMarkup = `
<table style="width:100%">
    <tr>
        <th>Firstname</th>
        <th>Lastname</th>
        <th>Age</th>
    </tr>
</table>`

【讨论】：