Koda rakstīšanas padomi, izmantojot DOM JavaScript
Pieņemsim, ka jūsu priekšā ir pietiekami sarežģīts uzdevums, kura realizācijai nepieciešams uzrakstīt noteiktu koda rindu daudzumu.
Nepareiza pieeja būtu mēģināt uzreiz uzrakstīt visu risinājuma kodu no sākuma līdz beigām un tikai tad sākt to pārbaudīt. Šajā gadījumā pastāv liela iespējamība, ka nekas nedarbosies, un kļūda būs jāmekā lielā koda daudzumā.
Pareiza pieeja ir uzdevuma sadalīšana mazos elementāros soļos, kurus jūs realizēsiet un uzreiz pārbaudīsiet to pareizību. Šajā gadījumā, pat ja kaut kur kļūdīsities, jūs to uzreiz pamanīsiet un izlabosiet.
Izmēģināsim praksē. Pieņemsim, ka jums ir rindkopas:
<p>1</p>
<p>2</p>
<p>3</p>
<p>4</p>
<p>5</p>
<p>6</p>
Pieņemsim, ka jūsu uzdevums ir atrast
rindkopas ar skaitļiem, kas dalās ar 3,
un atrast to skaitļu summu.
Kā pirmo mazo soli es ieteiktu iegūt mūsu rindkopas masīva veidā un izvadīt šo masīvu konsolē, lai pārliecinātos, ka mēs visu esam ieguvuši pareizi. Darīsim to:
let elems = document.querySelectorAll('p');
console.log(elems);
Nākamais mazais solis ir izmantot ciklu, lai izietu cauri mūsu rindkopām, un izvadītu katru no tām konsolē atsevišķi:
let elems = document.querySelectorAll('p');
for (let elem of elems) {
console.log(elem);
}
Un tagad cilpā izvadīsim mūsu rindkopu tekstus:
let elems = document.querySelectorAll('p');
for (let elem of elems) {
console.log(elem.textContent);
}
Tagad izvadīsim to rindkopu
tekstus, kuru skaitlis dalās ar 3:
let elems = document.querySelectorAll('p');
for (let elem of elems) {
let text = +elem.textContent;
if (text % 3 === 0) {
console.log(text);
}
}
Pārliecinoties, ka mēs iegūstam pareizās rindkopas, varam sākt to skaitļu summēšanu:
let elems = document.querySelectorAll('p');
let sum = 0;
for (let elem of elems) {
let text = +elem.textContent;
if (text % 3 === 0) {
sum += text;
}
}
console.log(sum);
Dots saraksts ar gadiem:
<ul>
<li>2000</li>
<li>2004</li>
<li>2021</li>
<li>2022</li>
<li>2025</li>
<li>2031</li>
</ul>
Iegūstiet tos gadus, kuru ciparu summa
ir vienāda ar 6. Atrodiet iegūto
gadu summu.