HTML වගුවට පේළි සහ තීරු එකතු කිරීම

අප සතුව #table යන HTML වගුවක් ඇතැයි සිතමු. අපි එයට නව පේළි සහ තීරු එකතු කරන ආකාරය ඉගෙන ගනිමු.

පේළි එකතු කිරීම

පේළි එකතු කිරීම අපහසු නැත: ඔබට tr එකක් සෑදිය යුතු අතර, ඉන්පසු එම පේළියට අවශ්‍ය සෛල සංඛ්‍යාව එකතු කරන ලූපයක් ධාවනය කරන්න (එය 3 වීමට ඉඩ දෙන්න):

javascriptlet table = document.querySelector('#table');

let tr = document.createElement('tr');

for (let i = 1; i <= 3; i++) {
  let td = document.createElement('td');
  tr.appendChild(td);
}

table.appendChild(tr);

තීරු එකතු කිරීම

තීරු එකතු කිරීම ටිකක් සංකීර්ණයි: වගුවේ සියලුම පේළි හරහා ගමන් කරන ලූපයක් ධාවනය කිරීමට සහ එක් එක් පේළියට නව සෛලයක් එකතු කිරීමට අවශ්‍ය වේ:

javascriptlet trs = document.querySelectorAll('#table tr');

for (let tr of trs) {
  let td = document.createElement('td');
  tr.appendChild(td);
}

html<table id="table">
  <tr>
    <td></td>
    <td></td>
  </tr>
  <tr>
    <td></td>
    <td></td>
  </tr>
</table>

csstd {
  width: 50px;
  height: 50px;
  border: 1px solid black;
}