// Array bidimensionale predefinito
let prodotti = [
["ID", "Prodotto", "Prezzo", "Quantità "],
[1, "Computer", 899.99, 15],
[2, "Mouse", 25.50, 42],
[3, "Tastiera", 45.00, 23],
[4, "Monitor", 299.99, 8],
[5, "Cuffie", 79.99, 31]
];
let mioBottone = document.getElementById("bottone-tabella");
let bottoneScomparsa = document.getElementById("cancella-tabella");
mioBottone.addEventListener("click", creaTabella)
bottoneScomparsa.addEventListener("click", cancellaTabella)
function cancellaTabella() {
let contenitoreTabella = document.getElementById("container");
contenitoreTabella.innerHTML = "";
}
function creaTabella () {
cancellaTabella();
let creaTabella = document.createElement("table");
creaTabella.className = "table-class";
let contenitoreTabella = document.getElementById("container");
contenitoreTabella.appendChild(creaTabella);
for (let i = 0; i < prodotti.length; i++) {
let row = document.createElement("tr");
let arrayProdotti = prodotti[i];
for (let cellaData of arrayProdotti) {
let cella;
if (i === 0) {
cella = document.createElement("th");
} else {
cella = document.createElement("td");
}
cella.textContent = cellaData;
row.appendChild(cella);
}
creaTabella.appendChild(row);
}
// if (contenitoreTabella) {
// contenitoreTabella.appendChild(creaTabella);
// }
let celleDati = document.querySelectorAll('.table-class');
// for (let cella of celleDati) {
// cella.style.backgroundColor = '#e0f7fa';
// }
celleDati.forEach(cella => {
cella.style.backgroundColor = '#e0f7fa';
});
}
// creaTabella();
//
// HTML
Esercizio 3 novembre