Fout met die verkryging van 'n element in JavaScript
Soms maak beginnersprogrammeerders 'n fout
deur die metode querySelectorAll te gebruik
om 'n enkele DOM-element te verkry,
in plaas van die metode
querySelector.
Kom ons kyk na die kenmerkende eienskappe van hierdie fout. Gestel daar is 'n paragraaf:
<p>teks</p>
'n Sekere programmeerder het besluit om die teks van hierdie paragraaf te verkry en te verander. Om dit te doen, het hy 'n verwysing na hierdie element in 'n veranderlike gekry, maar per ongeluk die verkeerde metode gebruik:
let elem = document.querySelectorAll('p');
Daarna het die programmeerder probeer om die teks van die paragraaf te verander. Maar, die teks van die paragraaf het nie verander nie:
elem.textContent = '!!!'; // het nie gewerk nie
Daar het egter geen fout in die konsole verskyn nie. Die saak is dat 'n toelaatbare operasie uitgevoer is, maar nie op een element nie, maar op 'n groep. En om die teks van 'n groep elemente te lees of te verander kan jy nie net so nie - net deur hulle te deurloop met 'n lus en na elke element afsonderlik te verwys.
Hoe om die fout op te spoor
Kom ons kyk hoe die programmeerder moet optree om hierdie fout op te spoor. In werklikheid, met 'n mate van ondervinding, is dit maklik om dit op te spoor volgens die kenmerkende tekens.
Gestel dit het egter nie gebeur nie. Dan
moet die programmeerder se eerste aksie wanneer hy foute soek
die weergawe van veranderlike waardes
in die konsole wees. In sy geval is daar net
een veranderlike - elem. Hy moet die waarde
van hierdie veranderlike uitvoer en kyk wat
daarin lê:
let elem = document.querySelectorAll('p');
console.log(elem); // sal 'n skikking uitvoer, en nie een element nie
In die konsole is dit dadelik sigbaar dat die veranderlike nie een element bevat nie, maar 'n skikking. Dit gee dadelik 'n voor die hand liggende leidraad dat daar 'n fout gemaak is in die metode om die element te verkry.
