Δημιουργία πινάκων HTML σε JavaScript
Ας υποθέσουμε ότι έχουμε έναν κενό πίνακα HTML όπως αυτός:
<table id="table"></table>
Ας γεμίσουμε αυτόν τον πίνακα με σειρές και στήλες. Ακολουθεί ένα παράδειγμα του τι πρέπει να έχουμε ως αποτέλεσμα:
<table id="table">
<tr>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td></td>
<td></td>
<td></td>
</tr>
</table>
Για να λύσουμε το πρόβλημα, χρειαζόμαστε δύο ένθετους βρόχους. Ο πρώτος βρόχος θα δημιουργεί τις σειρές του πίνακα, και ο δεύτερος - τα κελιά σε κάθε σειρά:
let table = document.querySelector('#table');
for (let i = 0; i < 3; i++) {
let tr = document.createElement('tr');
for (let i = 0; i < 3; i++) {
let td = document.createElement('td');
tr.appendChild(td);
}
table.appendChild(tr);
}
Δίνεται ένας κενός πίνακας HTML. Χρησιμοποιώντας δύο
ένθετους βρόχους for γεμίστε αυτόν
τον πίνακα με 5 σειρές και 5 στήλες.
Τροποποιήστε το προηγούμενο πρόβλημα έτσι ώστε
ο πίνακας να δημιουργείται με μέγεθος 10 σειρών
και 5 στηλών.
Τροποποιήστε το προηγούμενο πρόβλημα έτσι ώστε
σε κάθε td να προστίθεται το κείμενο 'x'.
Υλοποιήστε έναν γεννήτορα πινάκων, όπου το πλάτος και το ύψος
των πινάκων καθορίζεται σε δύο πεδία εισαγωγής (για παράδειγμα,
πίνακας 5 επί 10 κελιών).