DOM-ի օրինակով JavaScript-ում կոդ գրելու խորհուրդներ

Ենթադրենք, ձեր առջև դրված է բավականին բարդ խնդիր, որի իրականացման համար անհրաժեշտ է գրել որոշակի քանակությամբ տողեր կոդ։

Սխալ մոտեցում կլինի փորձել գրել ամբողջ լուծման կոդը միանգամից, և միայն դրանից հետո սկսել այն ստուգել։ Այս դեպքում մեծ է հավանականությունը, որ ձեզնից ոչինչ չի աշխատի, իսկ սխալը ստիպված կլինեք փնտրել կոդի մեծ ծավալի մեջ։

Ճիշտ մոտեցում է խնդիրը բաժանել փոքր տարրական քայլերի, որոնք դուք կիրականացնեք և անմիջապես կստուգեք դրանց ճիշտ լինելը։ Այս դեպքում, նույնիսկ եթե ինչ-որ տեղ սխալվեք, դուք անմիջապես կնկատեք խնդիրը և կուղղեք այն։

Եկեք փորձենք գործնականում։ Ենթադրենք, ունեք պարբերություններ.

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

Ենթադրենք, ձեր առջև դրված է խնդիր՝ գտնել պարբերությունները, որոնց թվերը բազմապատիկ են 3-ի, և գտնել դրանց թվերի գումարը։

Առաջին փոքր քայլը, որ ես առաջարկում եմ, մեր պարբերությունները ձեռք բերել զանգվածի տեսքով և արտածել այդ զանգվածը կոնսոլում, որպեսզի տեսնենք, որ մենք ամեն ինչ ճիշտ ենք ստացել։ Եկեք անենք դա.

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

Հաջորդ փոքր քայլը պետք է թափանցենք մեր պարբերությունները ցիկլով և արտածենք դրանցից յուրաքանչյուրը կոնսոլում առանձին.

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

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

Իսկ այժմ ցիկլում արտածենք մեր պարբերությունների տեքստերը.

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

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

Այժմ եկեք արտածենք այն պարբերությունների տեքստերը, որոնց թիվը բաժանվում է 3-ի.

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

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

Վստահվելով, որ մենք ստանում ենք ճիշտ պարբերությունները, կարող ենք անցնել դրանց թվերի գումարմանը.

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

Տրված է տարեթվերով ցուցակ.

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

Ստացեք այն տարեթվերը, որոնց թվանշանների գումարը հավասար է 6-ի։ Գտեք ստացված տարեթվերի գումարը։