JavaScriptda ota-onalarni noto'g'ri tozalash xatosi

Faraz qilaylik, bizda ma'lum bir ro'yxat mavjud. Tugmani bosish orqali biz har safar ushbu ro'yxatni qayta shakllantirishni, uning oldingi tarkibini tozalab tashlashni xohlaymiz. Yangi boshlanuvchilar ko'pincha qiyin yechimni topishga urinishda xato qilishadi. Keling, oddiy variantni ko'rib chiqaylik.

Faraz qilaylik, biz ro'yxatni o'zgaruvchiga olamiz:

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

Shuningdek, faraz qilaylik, biz tugmani olamiz:

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

Faraz qilaylik, tugmani bosish orqali bizning ro'yxatimiz ba'zi qiymatlar bilan to'ldiriladi. Misol uchun men joriy soniyaga mos keladigan tasodifiy qiymatni oldim:

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

Yuqoridagi kodda ro'yxatning yangi bandlari mavjud bo'lganlardan keyin qo'shiladi. Biz esa oldingi bandlar avval o'chirilishini xohlaymiz. Yechim oddiy - bizning ul tegi matnini shunchaki tozalashimiz kerak:

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