<!DOCTYPE html>
<html lang="es">
<head>
<meta charset="UTF-8">
<style>
td:nth-child(2) {text-align:right;} </style>
</head>
<body>
<p>
Selecciona uno o varios archivos:
<input type="file" multiple id="myInputFile">
</p>
<table id="archivosSubidos" border="1" cellpadding="10">
<thead>
<th>Nombre</th>
<th>Tamaño (Bytes)</th>
<th>Tipo de archivo</th>
</thead>
<tbody>
</tbody>
</table>
<script>
const fileInput = document.getElementById("myInputFile");fileInput.addEventListener("change", function(e) { const files = this.files;
const result=document.querySelector("#archivosSubidos tbody"); for (let i=0; i<files.length; i++) { const tr=document.createElement("tr"); tr.appendChild(insertTd(tr, files[i].name));
tr.appendChild(insertTd(tr, files[i].size));
tr.appendChild(insertTd(tr, files[i].type));
result.appendChild(tr);
}
});
function insertTd(father, string) { const td=document.createElement("td"); td.innerText=string;
return td;
}
</script>
</html>
Comentarios sobre la versión: Versión 1 (1)