JavaScriptda tsiklda ishlovchi qurilmalarni ulash

Oldingi darsda biz tsiklda yangi elementlar yaratishni o'rgandik. Keling, endi yangi elementlar yaratishda hodisa ishlovchilarini ulaymiz.

Faraz qilaylik, bizda yana shunday div-ota mavjud:

html<div id="parent"></div>

Keling, tsiklni ishga tushiramiz, u bizning divimizning oxiriga 9 ta yangi abzas qo'shadi, ularga klik hodisasi ishlovchisini ulanadi:

javascriptlet parent = document.querySelector('#parent');

for (let i = 1; i <= 9; i++) {
  let p = document.createElement('p');
  p.textContent = '!';
  
  // Klik ishlovchisini ulanamiz:
  p.addEventListener('click', function() {
    console.log(this.textContent);
  });
  
  parent.appendChild(p);
}
Задание 1

Div berilgan. Tsiklni ishga tushiring, u bizning divimizga 5 ta input qo'shadi. Shuningdek, biror abzas ham berilgan bo'lsin. Har bir yangi input fokusni yo'qotganda, o'z matnini abzasga yozishi uchun sozlang.