<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<title>Clinica Vida y Salud</title>
</head>
<body>
<header>
<div class="container">
<h1 class="titulo">Clinica Vida y Salud</h1>
</div>
</header>
<main>
<section class="container">
<h2>Mis pacientes</h2>
<table>
<thead>
<tr>
<th>Nombre</th>
<th>Peso(kg)</th>
<th>Altura(m)</th>
<th>Gordura Corporal(%)</th>
<th>IMC</th>
</tr>
</thead>
<tbody id="tabla-pacientes">
</tbody>
</table>
<button id="buscar-paciente" class="boton bto-principal">
Buscar Pacientes
</button>
</section>
</main>
<script>
function adicionarPacienteEnLaTabla(paciente){
var pacienteTr = construirTr(paciente);
var tabla = document.querySelector("#tabla-pacientes");
tabla.appendChild(pacienteTr);
};
function construirTr(paciente){
var pacienteTr = document.createElement("tr");
pacienteTr.classList.add("paciente");
pacienteTr.appendChild(construirTd(paciente.nombre,"info-nombre"));
pacienteTr.appendChild(construirTd(paciente.peso,"info-peso"));
pacienteTr.appendChild(construirTd(paciente.altura,"info-altura"));
pacienteTr.appendChild(construirTd(paciente.gordura,"info-gordura"));
pacienteTr.appendChild(construirTd(paciente.imc,"info-imc"));
return pacienteTr;
};
function construirTd(dato,clase){
var td = document.createElement("td");
td.classList.add(clase);
td.textContent = dato;
return td;
}
</script>
</body>
</html>