Sobes.tech
Junior

Ի՞նչ է JavaScript-ում հայտնվելը։

sobes.tech AI

Պատասխան AI-ից

Մեխանիզմ, որի ժամանակ DOM էլեմենտի վրա նախաձեռնված իրադարձությունը տարածվում է "վերև"՝ իր ծնողական էլեմենտների կողմը մինչև արմատը (document). Դեռևս մեծամասնության իրադարձությունները անցնում են երեք փուլերով:

  1. Հավաքման փուլ (Capturing phase): Իրադարձությունը շարժվում է վերից ներքև՝ դեպի նպատակային էլեմենտը: Իրադարձությունների լսողները, որոնք կապված են { capture: true } տարբերակով, գործարկվում են այս փուլում:
  2. Նպատակային փուլ (Target phase): Իրադարձությունը հասնում է նպատակային էլեմենտին, որի վրա այն նախաձեռնվել է: Լսողները, որոնք անմիջապես կապված են այս էլեմենտի հետ, գործարկվում են:
  3. Վլայման փուլ (Bubbling phase): Իրադարձությունը շարժվում է վերև՝ նպատակային էլեմենտից դեպի փաստաթղթի արմատը: Իրադարձությունների սովորական կապակցված լսողները, որոնք կապված են { capture: false } կամ առանց այդ նշանի, գործարկվում են այս փուլում: Սա այն փուլն է, որտեղ տեղի է ունենում "վլայումը" դասական իմաստով:

Վլայումը թույլ է տալիս իրականացնել իրադարձությունների դելեգացիա, երբ մի լսող է գտնվում ծնողական էլեմենտում և մշակվում է բազմաթիվ երեխաների իրադարձությունները:

Օրինակ՝

// HTML:
// <div id="parent">
//   <button id="child">Սեղմիր ինձ</button>
// </div>

const parent = document.getElementById('parent');
const child = document.getElementById('child');

parent.addEventListener('click', function() {
  console.log('Իրադարձությունը վլայվեց մինչև ծնողը');
});

child.addEventListener('click', function() {
  console.log('Իրադարձությունը նպատակային էլեմենտում (կոճակ)');
});

// Երբ սեղմում եք 'child' կոճակին, արտածման հաջորդականությունը կլինի՝
// "Իրադարձությունը նպատակային էլեմենտում (կոճակ)"
// "Իրադարձությունը վլայվեց մինչև ծնողը"

event.stopPropagation() մեթոդը կարող է օգտագործվել՝ հետագայում տարածումը դադարեցնելու համար (ինչպես վլայումը, այնպես էլ հավաքումը), երբ այն արդեն մշակվել է ընթացիկ լսողի կողմից: event.stopImmediatePropagation() դադարեցնում է վլայումը և չի թույլատրում մյուս լսողներին նույն էլեմենտում գործարկվել: event.preventDefault() կանխում է բրաուզերի ստանդարտ գործողությունը, կապված իրադարձության հետ, բայց չի դադարեցնում դրա տարածումը։