Rumah >hujung hadapan web >tutorial css >Mengapakah getElementsByClassName() Hanya Mengubah Setiap Kelas Lain?

Mengapakah getElementsByClassName() Hanya Mengubah Setiap Kelas Lain?

Susan Sarandon
Susan Sarandonasal
2024-11-27 18:57:12245semak imbas

Why Does getElementsByClassName() Only Change Every Other Class?

Corak Perubahan Kelas yang Tidak Diingini: Setiap Kelas Lain Terjejas

Anda berhadapan dengan cabaran semasa menggunakan getElementsByClassName() dalam JavaScript. Apabila cuba menukar kelas setiap elemen, anda menghadapi isu di mana hanya setiap kelas lain diubah suai.

Punca Punca: Pengubahsuaian HTMLCollection

Punca asas isu ini terletak pada sifat HTMLCollection yang dikembalikan oleh getElementsByClassName(). Semasa anda menukar kelas elemen dalam koleksi, koleksi itu sendiri dikemas kini dan elemen itu tidak lagi disertakan. Ini bermakna semasa anda mengulangi koleksi, anda secara berkesan melangkau elemen ganti.

Penyelesaian: Lelaran Melalui Tatasusunan

Untuk menyelesaikan isu ini, anda boleh mengulang melalui susunan koleksi asal dan bukannya mengubah suai koleksi semasa anda meneruskan. Ini memastikan anda menggunakan perubahan kelas pada setiap elemen, tanpa mengira pengubahsuaian sebelumnya.

Kod Kemas Kini menggunakan For Loop:

var blockSet = document.getElementsByClassName("block-default");
var blockSetLength = blockSet.length;

for (var i = 0; i < blockSetLength; i++) {
    blockSet[0].className = "block-selected";
}

Nota:

  • Daripada menukar kelas setiap elemen secara individu, anda boleh menggunakan gelung for untuk lelaran melalui elemen dan buat perubahan kelas.
  • Kod yang dikemas kini ini memperuntukkan kelas "yang dipilih blok" kepada elemen pertama tatasusunan blockSet untuk setiap lelaran.
  • Dengan menggunakan tatasusunan, anda elakkan isu koleksi diubah suai semasa lelaran.

Atas ialah kandungan terperinci Mengapakah getElementsByClassName() Hanya Mengubah Setiap Kelas Lain?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn