Ainda não tem acesso? Estude com a gente! Matricule-se
Ainda não tem acesso? Estude com a gente! Matricule-se

Solucionado (ver solução)

Tentando com forEach()

var campoFiltro = document.querySelector("#filtrar-tabela");


campoFiltro.addEventListener("input", function(){
    var pacientes = document.querySelectorAll(".paciente");
    var nome = pacientes.querySelector(".info-nome").textContent;
    var expressao = new RegExp(this.value, "i");    //Esta linha é uma expressão regular, no primeiro paramêtro diz o que deve ser comparado e no segundo se casesensitive o insensitive;

    if(this.value.length > 0){
        pacientes.forEach(function(paciente){    
            if(expressao.test(nome)){
                pacientes.classList.remove("invisivel");
            }else{
                pacientes.classList.add("invisivel");
            }
        })
    }else{
        pacientes.forEach(function(paciente){
            pacientes.classList.remove("invisivel");
        })
    }
})

Boa noite!!

Estou tentando realizar o código da aula através do forEach, porém estou tendo problemas, no console diz que "add" não é uma função. Alguém poderia me ajudar?

2 respostas
solução

Boa noite, Vinicius! Como vai?

O correto seria fazer assim:

if(expressao.test(nome)){
     paciente.classList.remove("invisivel");
}else{
     paciente.classList.add("invisivel");
}

Veja que tanto dentro do if quanto dentro do else o correto é usar paciente que é o parâmetro recebido pela função passada para o forEach() e não pacientes que é o conjunto de elementos selecionados pelo querySelectorAll(). Faça essa correção e veja se as coisas funcionam da forma forma vc esperava.

Quaquer coisa é só falar!

Grande abraço e bons estudos, meu aluno!

Obrigado Gabriel, abç!