Boa tarde a todos! Fiz essas modificações no projeto para que na página mostrasse o significado do IMC do paciente, para isso inseri na tabela uma nova coluna chamada Status. O status é apenas a informação de qual nível o IMC está, no arquivo index.css criei 4 estilos, cada um referente ao nível o IMC. Ficou assim:
.abaixo-peso{
background-color: lightyellow;
}
.normal{
background-color: lightblue;
}
.acima-peso{
background-color: #FFA500;
}
.obeso{
background-color: lightcoral;
}
O arquivo principal.js está desse jeito:
//criando array de pacientes
var pacientes = document.querySelectorAll(".paciente");
//função que valida os valores recebidos e retorna o imc calculado ou uma mesagem de erro
function calculaImc(peso, altura){
if(valida(peso, altura)){
return Math.round(peso /(altura * altura));
}else{
return "Peso ou altura inválido";
}
}
// valida o peso e a altura
function valida(peso, altura){
if(peso < 0 || peso >150 || altura < 0.3 || altura > 2.5){
return false;
}else{
return true;
}
}
// função que retorna o status do paciente de acordo com o IMC
function statusPaciente(imc){
if(imc < 18.5){
return "Abaixo do peso!";
}else if(imc >= 18.5 && imc < 25){
return "Peso normal!";
}else if(imc >= 25 && imc <30){
return "Acima do peso!";
}else{
return "Obeso!";
}
}
// loop que faz a chamada da função calculaImc e insere na TD, de todos pacientes
for(var i = 0; i < pacientes.length; i++){
var paciente = pacientes[i];
var peso = paciente.querySelector(".info-peso").textContent;
var altura = paciente.querySelector(".info-altura").textContent;
var imc = calculaImc(peso, altura);
// verifico se o imc está com inválido, caso sim mudo a cor da linha
if(imc == "Peso ou altura inválido"){
paciente.classList.add("paciente-invalido");
}
//adicionando o imc calculado e o status as suas respectivas td's
paciente.querySelector(".info-imc").textContent = imc;
paciente.querySelector(".info-status").textContent = statusPaciente(imc);
console.log(status);
}
O problema é que quando adiciono a classe referente ao nível do IMC, não funciona e da erro no for(fica todas as informações zeradas).
Alguma sugestão? Agradeço desde já a atenção.