<h2>Meus pacientes</h2>
<label for="filtrar-tabela">Filtre:</label>
<input type="text" name="filtro" id="filtrar-tabela" placeholder="Digite o nome do paciente">
<table>
</section>
<script src="js/calcula-imc.js"> </script>
<script src="js/form.js"> </script>
<script src="js/remover-paciente.js"> </script>
<script src="js/filtra.js"> </script>
</body>
#filtrar-tabela{
width: 200px;
height: 35px;
margin-bottom: 10px
}
.invisivel{
display: none;
}
var campoFiltro = document.querySelector("#filtrar-tabela");
campoFiltro.addEventListener("input", function(){
console.log(this.value);
var pacientes = document.querySelectorAll(".paciente");
if(this.value.length > 0){
for (var i = 0; i < pacientes.length; i++){
var paciente = pacientes[i];
var tdNome = paciente.querySelector(".info-nome");
var nome = tdNome.textContent;
var expressao = new RegExp(this.value,"i");
if( !expressao.test(nome)){
paciente.classList.add("invisivel");
}else{
paciente.classList.remove("invisivel");
}
}
}else{
for (var i = 0; i < pacientes.length; i++){
var paciente = pacientes[i];
paciente.classList.remove("invisivel");
}
}
});