Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

Seria essa uma má prática?

Eu vejo o tempo todo falar sobre "boas práticas". Antes de chegar nessa aula, decidi me arriscar para ver se conseguia criar a coluna do IMC e consegui. Mas seria essa forma que eu fiz um jeito "não recomendado", uma má prática? O melhor seria criar funções mesmo?

var botaoAdicionar = document.querySelector("#adicionar-paciente");
botaoAdicionar.addEventListener("click",function(event) {
    event.preventDefault();
    var form = document.querySelector("#form-adiciona");
    var nome = form.nome.value;
    var peso = form.peso.value;
    var altura = form.altura.value;
    var gordura = form.gordura.value;
    var imc = form.peso.value/(form.altura.value*form.altura.value);

    var pacienteTr = document.createElement("tr");
    var nomeTd = document.createElement("td");
    var pesoTd = document.createElement("td"); 
    var alturaTd = document.createElement("td"); 
    var gorduraTd = document.createElement("td"); 
    var imcTd = document.createElement("td"); 

    nomeTd.textContent = nome;
    pesoTd.textContent = peso;
    alturaTd.textContent = altura;
    gorduraTd.textContent = gordura;
    imcTd.textContent = imc.toFixed(2);

    pacienteTr.appendChild(nomeTd);
    pacienteTr.appendChild(pesoTd);
    pacienteTr.appendChild(alturaTd);
    pacienteTr.appendChild(gorduraTd);
    pacienteTr.appendChild(imcTd);

    var tabela = document.querySelector("#tabela-pacientes");
    tabela.appendChild(pacienteTr);


});
2 respostas
solução!

Fala ai Roberto, tudo bem? Vou dar a minha opinião sobre, isso porque vai depender muito de pessoas para pessoas.

Eu não vejo esse trecho de código como uma má prática, muitas vezes eu uso exatamente assim, para mim fica mais orientado a JavaScript e funções em vez de trabalhar com string pura ou innerHTML.

Um ponto importante também é caso tu precise adicionar algum listener de evento para alguma td ou tr, dessa forma que tu fez é possível de forma simples.

Espero ter ajudado.

Eae chefe bele? Eu achei maneiro demais a forma que criou o código! Como o Matheus falou varia de pessoa pra pessoa. Uma coisa que EU faria seria colocar esta função que você colocou dentro do addEventListener do botão do lado de fora e separado, assim:

adicionaColunaIMC(event){
    //Seu código aqui 
}

Pois ai caso você queria colocar essa função dentro de outro botão ou até reverter essa função com algum outro botão você pode mudar apenas o elemento selecionado do querySelector sem ter que copiar colar a função e etc. Até para a manutenção do próprio código fica bacana tb pq ai vc não mexe no listener e mexe apenas na função separadamente :D De resto parabéns

Quer mergulhar em tecnologia e aprendizagem?

Receba a newsletter que o nosso CEO escreve pessoalmente, com insights do mercado de trabalho, ciência e desenvolvimento de software