Vidokezo kwa Kuandika Msimbo kwa kutumia DOM katika JavaScript

Wacha tuseme unakabiliwa na shida ya kutosha ya utata, ambayo utekelezaji wake unahitaji kuandika idadi fulani ya mstari wa msimbo.

Mbinu isiyofaa itakuwa kujaribu kuandika msimbo mzima wa suluhisho kwa ujumla, kisha uanze kuukagua. Katika kesi hii, uwezekano wa kushindwa ni mkubwa, huku hitilafu ikilazimika kutafutwa katika wingi wa msimbo.

Mbinu sahihi ni kugawanya shida katika hatua ndogo ndogo za msingi, ambazo utatekeleza na kisha huangalia usahihi wake mara moja. Kwa njia hii, hata kama utakosea mahali fulani, utaigundua mara moja tatizo na kulirekebisha.

Wacha tujaribu kwenye mazoezi. Wacha tuseme una aya:

<p>1</p>
<p>2</p>
<p>3</p>
<p>4</p>
<p>5</p>
<p>6</p>

Wacha tuseme shida yako ni kupata aya zilizo na nambari zinazogawanyika kwa 3, na kisha upate jumla ya nambari zake.

Hatua ya kwanza ningependa kupendekeza ni kupata aya zetu kwa mfumo wa safu na kisha kuonyesha safu hiyo kwenye konsole, ili tuone kama tumepata kila kitu vizuri. Hebu tufanye hivi:

let elems = document.querySelectorAll('p');
console.log(elems);

Hatua inayofuata ni kuzipitia aya zetu kwa kutumia kitanzi na kuonyesha kila moja kwenye konsole tofauti:

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

for (let elem of elems) {
	console.log(elem);
}

Sasa kwenye kitanzi tuonyeshe maandishi ya aya zetu:

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

for (let elem of elems) {
	console.log(elem.textContent);
}

Sasa wacha tuonyeshe maandishi ya aya zile, ambazo nambari zake zinagawanyika kwa 3:

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

for (let elem of elems) {
	let text = +elem.textContent;
	
	if (text % 3 === 0) {
		console.log(text);
	}
}

Baada ya kuhakikisha kuwa tunapata aya sahihi, tunaweza kuanza kujumlisha nambari zake:

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);

Toleo la orodha ya miaka:

<ul>
	<li>2000</li>
	<li>2004</li>
	<li>2021</li>
	<li>2022</li>
	<li>2025</li>
	<li>2031</li>
</ul>

Pata miaka, ambayo jumla ya tarakimu ni sawa na 6. Tafuta jumla ya miaka iliyopatikana.