Olá, boa noite.. tentando refinar meu código referente ao exercício do curso de construir o script de calcular IMC me deparei com um problema, quando faço a mudança de todos os getElementsByClassName por querySelector meu script da um pau no qual não aparece no quest log, o que acontece é que, os pacientes que já estão adicionados por padrão calculam o IMC de forma correta e retorna tanto na página, quanto no quest log, já os pacientes adicionados por mim não retornam o valor do IMC, HELP... segue abaixo o código.
//Adicionando a classe paciente num variável para ser listada
var paciente = document.querySelectorAll('.paciente');
//Função de listar itens
function Listar(item, retorno) {
for (var i = 0; i < item.length; i++) {
var retornaLista = item[i];
retorno(retornaLista);
}
}
//Função adicionar novo paciente
var btnAdd = document.querySelector('#adicionar-paciente');
btnAdd.addEventListener('click',function addPaciente() {
event.preventDefault();
var campoNome = document.querySelector('#campo-nome');
var campoPeso = document.querySelector('#campo-peso');
var campoAltura= document.querySelector('#campo-altura');
if (campoNome.value == '') {
alert('preencha o campo de nome');
return false;
}
else if (campoPeso.value == '' || campoPeso.value == 0) {
alert('preencha o campo peso');
return false;
}
else if (campoAltura.value == '' || campoAltura.value == 0) {
alert('preencha o campo altura');
return false;
}
var novoPaciente = '<tr class="paciente">' +
'<td class="info-nome">' + campoNome.value + '</td>'+
'<td class="info-peso">' + campoPeso.value + '</td>'+
'<td class="info-altura">' + campoAltura.value + '</td>'+
'<td class="info-imc"></td>'+
'</tr>';
var tabela = document.querySelector('table');
tabela.innerHTML = tabela.innerHTML + novoPaciente;
campoNome.value = '';
campoPeso.value = '';
campoAltura.value = '';
});
//Função de calcular e retornar IMC do paciente
var btnImc = document.querySelector('#calcula-imcs');
btnImc.addEventListener('click', function () {
Listar(paciente, function retornaImc(retornaLista) {
var pacientePeso = retornaLista.querySelector('.info-peso');
var pacienteAltura = retornaLista.querySelector('.info-altura');
var pacienteInfo = {
peso: pacientePeso.textContent,
altura: pacienteAltura.textContent,
imc: function() {
var result = this.peso / (this.altura * this.altura);
return result;
}
};
var retornaImc = retornaLista.querySelector('.info-imc');
retornaImc.textContent = pacienteInfo.imc();
console.log(pacienteInfo.imc());
});
});