我怎样才能改进我的JavaScript代码

Question

我向网址发出请求，该网址返回 JSON 的数组，然后我输入 {{1像这样： ：

HTML

但我觉得它非常难看，我想改进这段代码。

我还想问一下，当我搜索记录时，它会把它放在正确的屏幕上，但是当我进行另一次搜索时，它会把答案放下来......

  

当我搜索仅返回时，如何永远编辑此代码   搜索结果，并采取旧的研究？

谢谢！

Answer 1

当我必须在js中创建html时，我会做这样的事情。 Salve mano，vi quevcébrpelo nome das variavel。

var trHTML = "<tr>";
        trHTML += "<td>"+data[i]["idServico"]+"</td>";
        trHTML += "<td>"+data[i]["dataEntradaServico"]+"</td>";
            .
            .
            .
     trHTML += "</tr>";

Answer 2

我建议你使用模板文字

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Template_literals

而不是使用.replace，因为它也很昂贵，模板文字会让你html更具可读性

$('#pesquisarServicos').click(function (e) {
  e.preventDefault();
  var parametro = document.getElementById('pesquisarServico').value;
  $.get("http://localhost:8080/service/list/"+parametro)
    .done(function (data) {
        var idServico, dataEntradaServico, dataSaidaServico, cpfPessoa, idStatus, descricaoServico;

        for (var i in data) {
            idServico = data[i]["idServico"];
            dataEntradaServico = data[i]["dataEntradaServico"];
            dataSaidaServico = data[i]["dataSaidaServico"];
            cpfPessoa = data[i]["cpfPessoa"];
            idStatus = data[i]["idStatus"];
            descricaoServico = data[i]["descricaoServico"];
            tabelaResultado.innerHTML +=`
                                        <tr>
                                            <td>${idServico}</td>
                                            <td>${dataEntradaServico}</td>
                                            <td>${dataSaidaServico}</td>
                                            <td>${cpfPessoa}</td>
                                            <td>${idStatus}</td>
                                            <td>${descricaoServico}</td>
                                        </tr>`;
        }
    });
});