繁体   English   中英

Coffeescript:用于连接HTML的For循环 <td> 元件

[英]Coffeescript : For loop to concatenate HTML <td> element

玩咖啡脚本。 我有以下for循环,可以在本机javascript中连接html元素,效果很好。 目前,我只是无法从coffeescript获取值json数据,即ia,ib。

//.js file
function createTr(json){
var tr='';
for (var i=0;i<json.data.length;i++){
var data ='<tr><td>' + json.data[i].a + ' - ' + json.data[i].b  +
  '</td>'+
  '<td>' + json.data[i].c +
  '</td>'+
    '<td>' + json.data[i].d +
  '</td>'+
  '</tr>';
tr +=data;
}
return tr;
}

语法如下

//.coffeescript
createTr = (json) ->
 tr=''
 tr + '<tr><td>' + i.a  + '-' + i.b+'</td>  <td>'+i.c+'</td><td>'+i.d+'</td></tr>' for i in json.data
 tr

根据以下内容从coffeescript中自动生成的javascript的源映射

//autogenerated js file from coffeescript file above
createTr = function(json) {
var i, j, len, ref, tr;
tr = '';
ref = json.data;
for (j = 0, len = ref.length; j < len; j++) {
  i = ref[j];
  tr + '<tr><td>' + i.a + '-' + i.b + '</td><td>' + i.c + '</td><td>' + i.d + '</td></tr>';
}
return tr;
};

唯一的区别是缺少作业。 CoffeeScript版本应为:

createTr = (json) ->
  tr=''
  tr += '<tr><td>' + i.a  + '-' + i.b+'</td>  <td>'+i.c+'</td><td>'+i.d+'</td></tr>' for i in json.data
  tr
  ##.coffee file
  createTr = (json) ->
    tr = ''
    for item in json.data
      data = """<tr>
        <td>#{item.a}-#{item.b}</td>
        <td>#{item.c}</td>
        <td>#{item.d}</td></tr> """
      tr += data

    return tr

并阅读http://coffeescript.org/有关循环,字符串和字符串中的变量的信息,例如"Some text #{variable}"

我更喜欢在for循环创建的数组上使用联接:

createTr = (json) ->
  ('<tr><td>' + i.a  + '-' + i.b+'</td>  <td>'+i.c+'</td><td>'+i.d+'</td></tr>' for i in json.data).join("")

或类似@ yavor.makc(如果这是我的代码),我可能会关注可读性:

createTr = (json) ->
  (for i in json.data
    "
    <tr>
      <td>#{i.a}-#{i.b}</td>
      <td>#{i.c}</td>
      <td>#{i.d}</td>
    </tr>
    "
  ).join("")

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM