JavaScript-də Elementin Alınmasında Səhv

Bəzən yeni başlayan proqramçılar tək DOM elementini almaq üçün querySelector metodu əvəzinə querySelectorAll metodundan istifadə edərək səhv edirlər.

Gəlin bu səhvin xarakterik xüsusiyyətlərinə nəzər salaq. Tutaq ki, bir abzas verilib:

<p>mətn</p>

Müəyyən bir proqramçı bu abzasın mətnini almaq və dəyişdirmək qərarına gəldi. Bunun üçün o, elementi səhvən düzgün olmayan metoddan istifadə edərək dəyişənə əlavə etdi:

let elem = document.querySelectorAll('p');

Sonra proqramçı abzasın mətnini dəyişdirməyə çalışdı. Lakin, abzasın mətnini dəyişmədi:

elem.textContent = '!!!'; // işləmədi

Eyni zamanda, konsolda heç bir səhv görünmədi. Məsələ ondadır ki, etibarlı bir əməliyyat yerinə yetirildi, ancaq tək element üzərində deyil, qrup üzərində. Və elementlər qrupunun mətnini birbaşa oxumaq və ya dəyişdirmək mümkün deyil - yalnız onları tsikllə keçib hər bir elementə ayrı-ayrılıqda müraciət etməklə.

Səhvi Necə Aşkar Etmək Olar

Gəlin proqramçının bu səhvi aşkar etmək üçün necə hərəkət etməli olduğuna baxaq. Əslində, müəyyən təcrübəyə malik olmaqla, onu xarakterik əlamətlərə görə asanlıqla aşkar etmək olar.

Ancaq tutaq ki, bu baş vermədi. O zaman proqramçının səhvləri axtararkən ilk hərəkəti dəyişənlərin dəyərlərini konsola çıxarmaq olmalıdır. Onun vəziyyətində yalnız bir dəyişən var - elem. Bu dəyişənin dəyərini çıxarmaq və onun içində nə olduğuna baxmaq lazımdır:

let elem = document.querySelectorAll('p');
console.log(elem); // bir elementi deyil, massivi çıxaracaq

Konsolda dərhal görünür ki, dəyişəndə tək element deyil, massiv var. Bu dərhal elementin alınması metodunda səhv edildiyi barədə aşkar bir ipucu verir.