JavaScript-ში მშობელის არასწორად გასუფთავების შეცდომა

დავუშვათ, გვაქვს გარკვეული სია. დავუშვათ, ღილაკზე დაჭერისას ჩვენ გვსურს ყოველ ჯერზე ახლიდან ჩამოვაყალიბოთ ეს სია, მისი წინა შიგთავსის გასუფთავების მერე. ახალბედები ხშირად უშვებენ შეცდომას, როდესაც ცდილობენ რაიმე რთული გადაწყვეტის გამოგონებას. მოდით შევხედოთ მარტივ ვარიანტს.

დავუშვათ, სიას ვიღებთ ცვლადში:

let ul = document.querySelector('ul');

დავუშვათ, ასევე ვიღებთ ღილაკს:

let btn = document.querySelector('button');

დავუშვათ, ღილაკზე დაჭერისას ჩვენი სია ივსება გარკვეული მნიშვნელობებით. მაგალითისთვის მე ავიღე შემთხვევითი მნიშვნელობა, რომელიც შეესაბამება მიმდინარე წამს:

btn.addEventListener('click', function() {
	let rand = new Date.getSeconds();
	
	for (let i = 0; i <= rand; i++) {
		let li = document.createElement('li');
		li.textContent = i;
		ul.append(li);
	}
});

ზემოთ მოცემულ კოდში, სიის ახალი პუნქტები დაემატება უკვე არსებულების შემდეგ. ჩვენ კი გვსურს, რომ წინა პუნქტები ჯერ წაიშალოს. გადაწყვეტა მარტივია - საჭიროა უბრალოდ გავუტიაროთ ჩვენი ტეგის ul ტექსტი:

btn.addEventListener('click', function() {
	ul.textContent = ''; // ვასუფთავებთ სიას
	let rand = new Date.getSeconds();
	
	for (let i = 0; i <= rand; i++) {
		let li = document.createElement('li');
		li.textContent = i;
		ul.append(li);
	}
});