Javascript 如何使代码更清晰？

如果这对你来说是一个简单的问题，我很抱歉。但我真的在努力解决这个问题

在我们的应用程序中，每个页面都有大量ajax调用。我们正在使用jqueryajax。目前我们正在做的是

当我们从like

myresults

中获得结果时，我们将传递到一个函数

populate

，在那里我们正在构建结果

function populate(myresults)
{        
    var str='<table>';       
    for(var i in myresults){
        str+='<tr>';
        str+=myresults[i].name;
        str+='</tr>';    
    }
    str+='</table>';

    $('#divId').html(str);
}

函数填充（myresults）
{        
var-str=''；
对于（myresults中的var i）{
str+=''；
str+=myresults[i].name；
str+=''；
}
str+=''；
$（'#divId'）.html（str）；
}

---

并非所有地方都在建桌子。代码工作得很完美，但我认为编写这样的代码不是正确的方法。我怎样才能美化我的代码。我可以使用jQuery或javascript。

您应该尝试查找TemplateEngine-它可以减少代码数量并使其更加清晰。

---

也许，创建一个新的DOM元素更正确

像这样：

function populate(myresults)
  {        
   var str= $('<table />)';       
      for(var i in myresults){
        str.append($('<td />').text(myresults[i].name).appendTo($('<tr />')));
      }
    $('#divId').empty().append(str);
  }

函数填充（myresults）
{        
var str=$（'）；
对于（myresults中的var i）{
str.append（$（''）.text（myresults[i].name）.appendTo（$（''）；
}
$（'#divId'）.empty（）.append（str）；
}

您应该通过一个linting引擎（如JSLint或JSHint）运行代码，并且您应该熟悉良好的实践

以下是优化代码的一种方法（多种可能的解决方案）：

function populate(myresults) {
    var table = $(document.createElement('table'));       

    $(myresults).each(function (i) {
        var row = $(document.createElement('tr')),
            cell = $(document.createElement('td')).text(myresults[i].name);
        row.append(cell);
        table.append(row);
    });

    $('#divId').append(table);
}

---

你可以这样做：

function populate(myResults)
{        
    var tab = $('<table />');       
    for(var i in myResults){
      if (myResults.hasOwnProperty(i)) {
          var tr = $('<tr />');
          tr.append($('<td /'>, {text: i.name}));
          tab.append(tr);
      }
    }
    $('#divId').append(tab);
}

函数填充（myResults）
{        
变量选项卡=$（''）；
对于（myResults中的var i）{
if（myResults.hasOwnProperty（i））{
var tr=$（''）；
tr.append（$）（'除了javascript和jquery之外，您可以在句子之间使用空格吗？）？这不是一个真正的问题，可能会被否决。一个简单的改进是使用模板引擎，如Handlebar。或者你可以更进一步，使用knockoutjs、angularjs或类似的工具。你是否尝试过knockoutjs来编写模板和处理绑定？尝试使用模板引擎，如
var table=$（document.createElement（'table'）；
代码上有一些打字错误…缺少jquery选择器中的
）
结束符。