Saya ingin javascript secara otomatis menambahkan id numerik yang bertambah untuk setiap elemen td saya.

Saya ingin skrip di bagian bawah setiap halaman HTML memberi tahu id pertama apa yang akan dimasukkan untuk halaman itu dan ++ secara otomatis untuk setiap elemen td berikutnya. Saya mencoba banyak hal dengan for loop dan ada sesuatu yang hilang dengan metode appendChild saya, saya tidak bisa membuatnya bekerja tetapi saya tahu saya hampir sampai.

Jika seseorang bisa membantu, itu akan sangat dihargai!

Berikut adalah cara memasukkan ID tersebut secara manual setiap bulan baru:

<tr>
    <td id="603" class="offweekend"></td>
    <td id="604" class="offmonth"></td>
    <td id="605" class="offmonth"></td>
    <td id="606" class="offmonth"></td>
    <td id="607" class="offmonth"></td>
    <td id="608" class="offmonth"></td>
    <td id="609" class="weekend">1</td>
</tr>

<script>
       tds = document.getElementsByTagName("td");
        tdlength = tds.length;
        firsttd = 603;
        lasttd = firsttd + tdlength;
        for (i = firsttd; i < lasttd; i++){
            td.appendChild() //???That's where i'm confused, i'm i wrong 
                                  with this approach?
        }
</script>   

//Thank you, i'm still learning :)
0
Sylvain Grannary 20 Agustus 2017, 21:05

2 jawaban

Jawaban Terbaik

Dengan asumsi Anda memiliki variabel firstValue yang menyimpan id dari td pertama, Anda dapat menggunakan ini:

document.querySelectorAll("td").forEach((v,i)=>v.id=i+firstValue);
  • querySelectorAll mengambil semua elemen td secara berurutan sebagai NodeList.
  • v adalah elemen td dan i adalah posisi elemen dalam array
0
Peter Schweitzer Jr 20 Agustus 2017, 18:38

Anda tidak perlu menggunakan appendChild. Anda cukup mengulangi melalui sel dan segera mengatur id.

let id = 603;
const cells = document.querySelectorAll('td');
cells.forEach(function(el) {
  el.id = id++;
});

Sedikit tambahan: Saya tidak tahu tujuan penggunaan Anda, tetapi Anda mungkin lebih baik menggunakan atribut data untuk menyimpan informasi ini.

let id = 603;
const cells = document.querySelectorAll('td');
cells.forEach(function(el) {
  el.setAttribute('data-id', id++);
});
0
Andy 20 Agustus 2017, 18:33