// # (gH) -_- arrayEnTable.js ; TimeStamp (unix) : 19 Novembre 2020 vers 19:45
function array2table(tableau,idtableau,idParent,classeTableau) {
// ######################################################
// on passe d'un tableau Javascript (array à une dimension)
// à un tableau XHTML (<table>)
// par exemple, à partir du tableau Javascript ["Janvier","Février","Mars"]
// on veut produire le code suivant :
// ### <div id="divTableau1">
// ###
// ### <table id="tableau1" class="bordure collapse padding20" cellpadding="10" border="1">
// ### <tr>
// ### <th>Position</th>
// ### <th>Valeur</th>
// ### </tr>
// ### <tr>
// ### <td class="droite">1</td>
// ### <td>Janvier</td>
// ### </tr>
// ### <tr>
// ### <td class="droite">2</td>
// ### <td>Février</td>
// ### </tr>
// ### <tr>
// ### <td class="droite">3</td>
// ### <td>Mars</td>
// ### </tr>
// ### </table>
// ###
// ### </div>
// Etape 1 : on crée un élément <table> avec un id et les "bons" attributs border et class
tab = document.createElement("table") ;
tab.setAttribute("id",idtableau) ;
tab.setAttribute("border",1) ;
tab.setAttribute("cellpadding",10) ;
if (classeTableau) { tab.setAttribute("class",classeTableau) ; } ;
// Etape 2 : on crée un élément <tr> pour les entetes
// et on lui adjoint deux éléments <th>
etr = document.createElement("tr") ;
etd1 = document.createElement("th") ;
txt1 = document.createTextNode("Position")
etd1.appendChild(txt1) ;
etr.appendChild(etd1) ;
etd2 = document.createElement("th") ;
txt2 = document.createTextNode("Valeur")
etd2.appendChild(txt2) ;
etr.appendChild(etd2) ;
tab.appendChild(etr) ;
// Etape 3 : on utilise une boucle pour créer les éléments <tr> et leur contenu
nblig = tableau.length
for (var ilig=0 ; ilig < nblig ; ilig++) {
etr = document.createElement("tr") ;
etd1 = document.createElement("td") ;
etd1.setAttribute("class","droite")
txt1 = document.createTextNode(ilig+1)
etd1.appendChild(txt1) ;
etr.appendChild(etd1) ;
etd2 = document.createElement("td") ;
txt2 = document.createTextNode(tableau[ilig]) // # c'est là qu'on utilise le tableau passé en paramère
etd2.appendChild(txt2) ;
etr.appendChild(etd2) ;
tab.appendChild(etr) ;
} ; // fin pour ilig
// Etape 4 : il reste à insérer notre élément <table> dans la page
document.getElementById(idParent).appendChild(tab) ;
} ; // fin de fonction array2table
|
Retour à la page principale de
(gH)