在字符串定义中追加变量

时间:2018-09-12 16:06:09

标签: javascript

我正在尝试将数据表格式化为字符串并将其返回到页面。我有以下内容,但恐怕这不是定义变量的有效方法。

var tableOutput = ' <
  table class = \"child-info\" cellpadding=\"5\" cellspacing=\"0\" border=\"0\" style=\"padding-left:50px;\">'+
'<tr>' +
'<td>Level:</td>' +
'<td>' + d.deg_codes[0] + '</td>' +
  '</tr>' +
  '<tr>' +
  '<td>Level:</td>' +
  '<td>' + d.deg_codes[1] + '</td>' +
  '</tr>' +
  '</table>';
return tableOutput;

但是,当我只返回整个定义语句本身时,它就会起作用。不幸的是,我需要将它作为变量来进行修改。有没有更好的方法来定义这个?还是我必须做大量的附加操作?

编辑

将其用作:

      var tableOutput = `
      <table class = "child-info" cellpadding="5" cellspacing="0" border="0" style="padding-left:50px;">
          <tr>
              <td>Level USF Tampa:</td>
              <td>${d.deg_codes[0]}</td>
          </tr>
          <tr>
              <td>Level USF Tampa:</td>
              <td>${d.deg_codes[1]}</td>
          </tr>
      </table>`;

1 个答案:

答案 0 :(得分:1)

使用javascript template strings

`string text line 1
 string text line 2`

还要删除不必要的引号'+进行串联

function showTable() {
  const d = {
    deg_codes: [3434, 4444]
  };

  var tableOutput = `<table class = "child-info" cellpadding="5" cellspacing="0" border="0" style="padding-left:50px;">
          <tr>
              <td>Level:</td>
              <td>${d.deg_codes[0]}</td>
          </tr>
          <tr>
              <td>Level:</td>
              <td>${d.deg_codes[0]}</td>
          </tr>
      </table>`;

  return tableOutput;
}

document.write(showTable());