模板化HTML创建网页,但在输出的每个字母(数字等)之间插入空格

时间:2019-04-26 16:34:08

标签: html google-apps-script web-applications

我正在按照https://developers.google.com/apps-script/guides/html/templates中的说明来处理模板HTML版本。我的代码使我一直进入格式正确的网页,但是有一个小问题:代码在每个项目之间都留有空白。因此,我得到的是“一个”而不是“一个项目”。 (实际输出的屏幕截图如下。)

我怀疑罪魁祸首在html文件中,该文件也在下面重新打印。

Screenshot

我研究了模板化的html和“空白”,“插入的空间”等,发现没有其他人遇到过这个问题。

最小完整可验证示例:

Index.html

<!DOCTYPE html>
<html>
  <head>
    <base target="_top">
  </head>
  <body>
<table>
    <ul type="square">
      <? for (var i = 0; i < data.length; i++) { ?>
          <li><? for (var j = 0; j < data[i].length; j++) { ?>
            <?= data[i][j] ?>
          <? } ?></li><br>
      <? } ?>
    </ul>
    </table>
  </body>
</html>

data来自

Code.gs

function doGet(){
    var instrument = "Martin D-18 (↓1/2)"; 
    var tuning = "Drop D";
    var key ="Db";
    var t = HtmlService.createTemplateFromFile('Index');
    t.data = [instrument, tuning, key];
    return t.evaluate();
}

在现实世界中,变量Instrument,Tuning,Key是从电子表格中检索的简单字符串,但是如果我将它们替换为如上所示的字符串类型的变量,则能够重现同样的问题。

更新-

re monofont没问题。这是脚本的日志,显示了html正在解析的基础变量。如您所见,没有不适当的空格。

[19-04-26 13:27:24:743 EDT] instrument = Martin D-18 (↓1/2)
[19-04-26 13:27:24:743 EDT] tuning = Drop D
[19-04-26 13:27:24:744 EDT] settings = 
[19-04-26 13:27:24:744 EDT] key = Db
[19-04-26 13:27:24:745 EDT] chord = D

2 个答案:

答案 0 :(得分:1)

避免在HTML中添加多余的空格很重要。

里面<?和?>,您可以根据需要添加任意多个空格,但是空格之外的空格是HTML中的空格,将由浏览器呈现。

此代码删除了这些多余的空格。

  <? for (var i = 0; i < data.length; i++) { ?>
      <li><? for (var j = 0; j < data[i].length; j++) { 
        ?><?= data[i][j] ?><?
       } ?></li><br>

  <? } ?>

但是this answer更好。问题不仅在于HTML中的空格,还在于字符串上的迭代。

答案 1 :(得分:1)

问题:

figure(3); hold on; quiver3(0,0,0,A(1,1),A(1,2),A(1,3),0); quiver3(0,0,0,A(2,1),A(2,2),A(2,3),0); quiver3(0,0,0,A(3,1),A(3,2),A(3,3),0); 是一维数组。您正在以嵌套方式对其进行两次迭代。

如果data(对于i = 0)是字符串,

data[i]

data[0] "Martin D-18 (↓1/2)" 将是字符串:

data[i][j]

as字符串像数组一样可迭代。

解决方案:

data[0][0] M data[0][1] a data[0][2] r data[0][3] t data[0][4] i data[0][5] n data[0][6] data[0][7] D data[0][8] - data[0][9] 1 data[0][10] 8 data[0][11] data[0][12] ( data[0][13] ↓ data[0][14] 1 data[0][15] / data[0][16] 2 data[0][17] ) 数组中每个元素循环一次。

摘要:

data