Saya memiliki tabel dalam html dan saya ingin mengubah teks di dalam sel yang berbeda menggunakan js. Tabel saya terlihat seperti ini:

    <tr><td colspan="7" style="text-align:center;">Calendar evenimente tds</td></tr>
    <tr>
      <th>Data1</th>
      <th>Data2</th>
      <th>Data3</th>
      <th>Data4</th>
      <th>Data5</th>
      <th>Data6</th>
      <th>Data7</th>
    </tr>
    <tr>
      <td id="col1row1">null</td>
      <td id="col2row1">null</td>
      <td id="col3row1">null</td>
      <td id="col4row1">null</td>
      <td id="col5row1">null</td>
      <td id="col6row1">null</td>
      <td id="col7row1">null</td>
    </tr>
</table>

Dan skrip js saya terlihat seperti ini:

var j=0;
for(j=0;j<=7;j++)
document.getElementById("col"+j+"row1").innerHTML=j;

Tapi saya mendapatkan kesalahan ini:

Uncaught TypeError: Cannot set property 'innerHTML' of null

Pertanyaan saya adalah apa cara yang tepat untuk memodifikasi teks di dalam sel tabel HTML dan apa yang saya lakukan salah?

1
Florin Baciu 9 Januari 2021, 21:45

3 jawaban

Jawaban Terbaik

Iterasi pertama loop Anda gagal karena tidak ada col0. Daripada mengulangi ID seperti ini, Anda cukup mengulang elemen dengan tag:

Array.from(document.getElementsByTagName('td')).forEach((td, index) => {
  td.innerHTML = index
})

Jika Anda ingin penghitungan dimulai dari 1, gunakan td.innerHTML = index + 1.

2
Zac Anger 9 Januari 2021, 18:53

Loop memanggil ID yang tidak ada.make for loop dimulai dengan 1 bukannya nol karena tidak ada col0row1 di html Anda

 var j;
for(j=1;j<=7;j++){
document.getElementById("col"+j+"row1").innerHTML=j;
}
1
Rowan Mamdouh 9 Januari 2021, 19:01

Seperti pada j = 0 tidak ada elemen dengan id "col0row1" maka kesalahan tidak tertangkap.

var j = 1
for(j=1;j<=7;j++){
    document.getElementById("col" + j + "row1").innerHTML = j;
}
1
Nitesh 11 Januari 2021, 08:04