javascript'da dom manipulyatsiyasi

PPTX 20 sahifa 2,6 MB Bepul yuklash

20 sahifa

FaylHub.uz

Telegram orqali yuklab olish

Hajm 2,6 MB

Fayl turi PPTX

Sahifalar 20

Yangilangan Dek 2025

Sahifa ko'rinishi (5 sahifa)

Pastga aylantiring 👇

1 / 20

powerpoint presentation oʻzbekiston respublikasi oliy ta’lim, fan va innovatsiyalar vazirligi taqdimot mavzu: javascript'da dom manipulyatsiyasi 01 domga kirish va asosiy tushunchalar 02 dom bilan ishlash: elementlarni boshqarish 03 domning optimallashtirilishi, xavfsizligi va zamonaviy yondashuvlar reja: dom ga kirish window.document obyekti domning asosiy kirish nuqtasidir. bu ob'ekt orqali turli xil usullar va xususiyatlar html elementlariga murojaat qilish imkonini beradi. dom (document object model) veb-sahifa tarkibini ob'ekt sifatida ifodalaydi. javascript domga kirish orqali html elementlariga, ularning atributlariga va uslublariga murojaat qila oladi. dom tuzilishi dom tuzilishi daraxtga o'xshaydi, unda 'document' ildiz tugun hisoblanadi va har bir html elementi tugun bo'lib, ota-ona va bola tugunlari o'rtasidagi 1-nchi darajali ierarxiyani yaratadi. domdagi har bir html elementi ob'ekt bo'lib, xususiyatlari (masalan, 'id', 'class') va usullari (masalan, 'addeventlistener') mavjud. bu ob'ektlar 3 ta asosiy tugun turiga bo'linadi: elementlar, matnlar va atributlar. elementlarni tanlash getelementsbyclassname() usuli html elementlarining jonli htmlcollection-ini qaytaradi, ya'ni dom-dagi o'zgarishlar avtomatik ravishda aks …

2 / 20

shqasi bilan almashtirish imkonini beradi, bunda yangi element (newchild) avvalgi elementning (oldchild) o'rnini egallaydi, elementlar ota-onasini ko'rsatish bilan bog'liq. element.remove() metodi elementni domdan butunlay o'chiradi, shu bilan birga unga tegishli barcha voqea tinglovchilarini (event listeners) ham olib tashlaydi, lekin xotiradan tozalamaydi. element atributlari bilan ishlash getattribute() va setattribute() usullari element atributlarining qiymatlarini mos ravishda olish va o'zgartirish uchun ishlatiladi, misol uchun element.getattribute('id') id qiymatini qaytaradi. atributlar html elementlarining xususiyatlarini aniqlaydi. element.src = 'image.jpg' kabi to'g'ridan-to'g'ri kirishdan foydalanish ko'pincha setattribute() dan tezroq va osonroqdir. css uslublarini o'zgartirish javascript orqali elementlarning css uslublarini o'zgartirish, element.style ob'ektidan foydalanib, inline uslublarni belgilash imkonini beradi. masalan, element.style.backgroundcolor = 'red' orqali fon rangini o'zgartirish mumkin. element.classlist xususiyati orqali elementlarga css klasslarini qo'shish, o'chirish yoki almashtirish mumkin. element.classlist.add('active') klassni qo'shsa, element.classlist.remove('hidden') klassni o'chiradi. voqealar bilan ishlash voqea ob'ekti voqea haqida batafsil ma'lumot beradi, masalan, target (voqeani qo'zg'atgan element), currenttarget (tinglovchi biriktirilgan element) va preventdefault() usuli standart harakatni …

3 / 20

taradi, shu jumladan elementlar, matn va izohlar. children xususiyati faqat element tugunlarini (htmlcollection) qaytaradi. dom o'zgarishlarini optimallashtirish reflow va repaintni minimallashtirish uchun o'zgarishlarni yig'ing; elementlarni bir necha marta o'zgartirish o'rniga, ularni bitta 'fragment'ga o'zgartiring va keyin domga qo'shing. offlayn dom manipulyatsiyasi, masalan, vaqtinchalik elementga o'zgartirishlar kiritib, so'ngra faqat bitta operatsiya orqali domga qo'shish, 10+ marta reflow va repaintni kamaytiradi. virtual dom va uning afzalliklari virtual dom - bu haqiqiy domning xotiradagi yengil nusxasi bo'lib, javascriptda yaratilgan. u elementlarning xususiyatlari va atributlarini node daraxti shaklida saqlaydi. virtual dom haqiqiy dom bilan solishtirilganda tezroq, chunki u haqiqiy domga kamroq o'zgarishlar kiritadi. faqatgina farqlar aniqlangandan so'ng, o'zgartirishlar haqiqiy domda amalga oshiriladi. zamonaviy dom apilari (mutationobserver) 01 02 mutationobserver interfeysi dom daraxtidagi o'zgarishlarni kuzatish uchun asinxron mexanizmni taqdim etadi, bu veb-ilovalar uchun samarali va sezgir yechimdir. sales 1st qtr 2nd qtr 100 0 sales 1st qtr 2nd qtr 100 0 misollar va amaliy mashqlar …

4 / 20

klar react virtual domni ishlatadi, bu esa real domga to'g'ridan-to'g'ri o'zgartirishlar sonini kamaytiradi va shu orqali 16.8 versiyasidan boshlab hooks kabi qulayliklar qo'shilgan. jquery dom manipulyatsiyasini soddalashtiradi, brauzeraro muvofiqlikni ta'minlaydi va ajax kabi ko'plab funksiyalarni qisqa sintaksis bilan taqdim etadi, 2006-yildan beri keng qo'llaniladi. brauzerlararo muvofiqlik dom manipulyatsiyasi uchun turli brauzerlarda, masalan, ie 11 va chrome 90+ da turli xatti-harakatlar bo'lishi mumkin; css xususiyatlari va javascript apilari har xil talqin qilinadi, bu esa moslikni tekshirishni talab qiladi. brauzerlararo muvofiqlikka erishish uchun zamonaviy veb-standartlarga rioya qiling, shuningdek, 10 dan ortiq brauzerlar versiyalarini qo'llab-quvvatlash zarurligini tushunish lozim. polifillar va transpilyatorlardan foydalanish eski brauzerlarni qo'llab-quvvatlashga yordam beradi. xulosa dom manipulyatsiyasi veb-dasturlashda interaktivlikni ta'minlash uchun juda muhimdir, lekin uning samaradorligi va xavfsizligiga 100% e'tibor qaratish lozim, aks holda ishlash va xavfsizlik muammolari kelib chiqishi mumkin. brauzerlararo muvofiqlikni ta'minlash, dom o'zgarishlarini optimallashtirish (reflow va repaint kamaytirish) kabi jihatlar veb-saytingizning 90% foydalanuvchilar uchun yaxshi ishlashiga kafolat …

5 / 20

javascript'da dom manipulyatsiyasi - Page 5

Ko'proq o'qimoqchimisiz?

Barcha 20 sahifani Telegram orqali bepul yuklab oling.

To'liq faylni yuklab olish

"javascript'da dom manipulyatsiyasi" haqida

powerpoint presentation oʻzbekiston respublikasi oliy ta’lim, fan va innovatsiyalar vazirligi taqdimot mavzu: javascript'da dom manipulyatsiyasi 01 domga kirish va asosiy tushunchalar 02 dom bilan ishlash: elementlarni boshqarish 03 domning optimallashtirilishi, xavfsizligi va zamonaviy yondashuvlar reja: dom ga kirish window.document obyekti domning asosiy kirish nuqtasidir. bu ob'ekt orqali turli xil usullar va xususiyatlar html elementlariga murojaat qilish imkonini beradi. dom (document object model) veb-sahifa tarkibini ob'ekt sifatida ifodalaydi. javascript domga kirish orqali html elementlariga, ularning atributlariga va uslublariga murojaat qila oladi. dom tuzilishi dom tuzilishi daraxtga o'xshaydi, unda 'document' ildiz tugun hisoblanadi va har bir html elementi tugun bo'lib, ota-...

Bu fayl PPTX formatida 20 sahifadan iborat (2,6 MB). "javascript'da dom manipulyatsiyasi"ni yuklab olish uchun chap tomondagi Telegram tugmasini bosing.

Teglar: javascript'da dom manipulyatsiy… PPTX 20 sahifa Bepul yuklash Telegram