⊗jsPmPrTCF 469 of 505 menu

HTML cədvəllərinin ardıcıl doldurulması

Tutaq ki, bizim belə boş bir HTML cədvəlimiz var:

<table id="table"></table>

Gəlin bu cədvəli xanalarla dolduraq və edək ki, bu xanalarda 1-dən 9-a qədər rəqəmlər olsun. Budur, bizim əldə etməli olduğumuz nəticənin nümunəsi:

<table id="table"> <tr> <td>1</td> <td>2</td> <td>3</td> </tr> <tr> <td>4</td> <td>5</td> <td>6</td> </tr> <tr> <td>7</td> <td>8</td> <td>9</td> </tr> </table>

Gəlin realizasiyaya başlayaq.

Əvvəlcə gəlin sadəcə 33 ölçülü, hər yerində 'x' hərfləri olan bir cədvəl edək:

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'); td.textContent = 'x'; tr.appendChild(td); } table.appendChild(tr); }

Gəlin indi elə edək ki, xanalarda 'x' hərfləri əvəzinə artan sıra ilə rəqəmlər yazılsın.

Bunun üçün bizə daxili dövrənin hər bir təkrarlanmasında ardıcıl olaraq dəyərlərini artıracaq başqa bir sayğac daxil etmək lazımdır, budur belə:

let table = document.querySelector('#table'); let k = 1; // sayğacın başlanğıc dəyəri for (let i = 0; i < 3; i++) { let tr = document.createElement('tr'); for (let i = 0; i < 3; i++) { let td = document.createElement('td'); td.textContent = k; // sayğacı xanaya yazırıq k++; // sayğacı artırırıq tr.appendChild(td); } table.appendChild(tr); }

Ekranda ölçüsü 5 sıra 5 sütun olan HTML cədvəlini elə çap edin ki, onun xanalarında 1-dən 25-ə qədər rəqəmlər ardıcıl olaraq dur sun.

Əvvəlki məsələni elə dəyişin ki, cədvəlin xanalarında 2-dən 50-ə qədər olan cüt rəqəmlər yazılsın.

azbydeenesfrkakkptruuz