darsga qaytish

Jonli taymer elementi

Bizda yaxshi formatlangan vaqtni ko’rsatish uchun <time-formatted> elementi allaqachon mavjud.

Joriy vaqtni ko’rsatish uchun <live-taymer> elementini yarating:

  1. U <time-formatted> dan ichki foydalanishi kerak, uning funksiyalarini takrorlamasligi kerak.
  2. Har soniyada belgilash (yangilanishlar).
  3. Har bir belgi uchun joriy sana event.detail da ko’rsatilgan tabel nomli maxsus hodisa yaratilishi kerak (Maxsus eventlarni jo'natish bobiga qarang).

Foydalanish:

<live-timer id="elem"></live-timer>

<script>
  elem.addEventListener("tick", (event) => console.log(event.detail));
</script>

Demo:

Vazifa uchun sandbox-ni oching.

Yodda tuting:

  1. Element hujjatdan olib tashlanganida biz setInterval taymerini tozalaymiz. Bu muhim, aks holda, agar kerak bo’lmasa ham, u tiqishni davom ettiradi. Va brauzer ushbu elementdan xotirani tozalay olmaydi va u tomonidan havola qilinadi.
  2. Joriy sanaga elem.date xususiyati sifatida kirishimiz mumkin. Barcha sinf usullari va xususiyatlari tabiiy ravishda element usullari va xususiyatlaridir.

Yechimni sandbox-da oching.