Sündmuste mullitamine ja sündmuste jäädvustamine on sündmuse voo ajal JavaScripti enim kasutatud terminid. Need on kaks võimalust sündmuste levitamiseks HTML DOM API-s. See artikkel JavaScripti sündmuste mullitamise ja sündmuste jäädvustamise kohta kirjeldab üksikasjalikult, miks me neid vajame järgmises järjestuses:
Mis on JavaScripti sündmuste mullitamine?
Sündmuste mullitamine on termin, millega inimesed peavad veebirakenduse või veebilehe arendamise ajal kokku puutuma . Põhimõtteliselt on sündmuste mullitamine tehnika, mille korral kutsutakse sündmuste käitlejaid, kui üks üksus on pesastatud teise üksuse külge ja peab olema samast sündmusest. See sarnaneb kapseldamisega.
programmi lõpetamine javas
Sündmuste mullitamine on ainult väike osa JavaScripti sündmuste käitlemisest. Selle paremaks mõistmiseks peame teadma sündmuste levitamise kohta ja selle kohta, kuidas see toetab ürituste mullitamist.
Mis on sündmuste levitamine?
Sündmuste levikut saab võrrelda vanemterminina koos selle lapsena pulbitseva ja jäädvustava sündmusega.See on esindatud järgmiselt:
Kui klõpsate mõnel pildil, ei genereeri see mitte ainult kliki sündmust, vaid see läheb edasi vanemale 'a' ja vanaisale 'li'. Sel viisil toimub funktsiooni levik. Siin loetakse pilti lapseks ja see on sündmuse sihtmärk, kus klõps genereeritakse. Kujutis koos esivanematega moodustab koos puu terminoloogias haru. Haru on oluline, kui õpime tundma rada, mida mööda sündmus levib.
Kõigile kuulajatest kutsutakse vastavalt sündmuse objekt, mis kogub teavet sündmuse kohta. See levitamine on väga oluline, kui õpime tundma kõigi antud ürituse kuulajate kutsumist. Ülalolevalt pildilt võime märgata, et haru määramine on staatiline. Sündmuse ajal toimuvaid puu muudatusi eiratakse. Siin on levimine kahesuunaline, st see läheb aknast sündmuse sihtmärgini ja jõuab tagasi. Siin on levitamine üldjoontes jaotatud kolme põhitüüpi. Need on:
- Pildistamisetapp: Aknast liikumine sündmuse sihtfaasi.
- Sihtfaas: See on sihtfaas.
- Mulli faas: Sündmuse sihtvanemalt tagasi aknasse.
Mis on sündmuste jäädvustamine?
Selles etapis kutsutakse köitvaid kuulajaid, kelle väärtus on registreeritud kui „tõene“. See on kirjutatud järgmiselt:
el.addEventListener ('klõps', kuulaja, tõene)Siin on kuulaja väärtus registreeritud tõeseks, nii et see sündmus on jäädvustatud. Kui väärtust ei olnud, oli väärtus vaikimisi vale ja sündmust ei hõivatud. Nii et selles etapis leiab sündmus, mille väärtus on tõsi, ainult tee aknast ning teda kutsutakse ja jäädvustatakse.
Seejärel kutsutakse sündmuse sihtfaasis kõik registreeritud kuulajad olenemata nende lipu staatusest, mis on tõene või vale.
Sündmuste mullitamise ja sündmuste jäädvustamise kasutamine JavaScriptis
Bubblingi faasis kutsutakse ainult mittekandjat, st sündmusi, mille lipuväärtus on „väär”. Sündmuste mullitamine ja sündmuste hõivamine on DOM (Document Object Model) terminoloogias väga kasulikud ja olulised.
el.addEventListener ('klõps', kuulaja, vale) // kuulaja ei haara el.addEventListener ('klõps', kuulaja) // kuulaja ei hõivataÜlal koodikood näitab mullitamise ja jäädvustamise faasi toimimist. Kõik sündmused ei lähe sündmuse sihtmärgini. Mõni neist ei mullita. Nende reis peatub pärast sihtfaasi. Kolme sündmuse faasivoogu illustreerib järgmine diagramm:
Sündmuste mullitamine ei toimi igat tüüpi sündmustel, kuid kuulajal peab see olema “.Mull ”Sündmuse objekti tõeväärtus. Mõned muud omadused hõlmavad järgmist:
- e.siht: mis viitab sündmuse sihtmärgile.
- e.currentTarget: see on režiim, kuhu praegused kuulajad on registreeritud. Siin viidatakse väärtusele, kasutades seda märksõna.
- e.eventPhase: See on täisarv, mis viitab veel kolmele märksõnale, näiteks Capturing_phase, Bubbling_phase, AT_Target faas.
Tööprotseduur
Vaatame ülaltoodud illustratsiooni lähemalt. Klõpsame elemendil “buttonOne” ja siis käivitatakse kohe sündmus. Tavaliselt alustab sündmus teekonda juurest, mis on puu ülemine element. Seejärel läheb puu järgmiseks sihtürituseks, mis on “buttonOne”. Reisimine toimub järgmiselt:
Nagu joonisel näidatud, jõuab sündmus DOM-i terminoloogiate kaudu lõpuks sihtmärgi sündmuseni. Nüüd, kui sündmus on oma eesmärgi saavutanud, see ei lõpe. See jätkub DOM-i terminoloogias ja jätkub, nagu on näidatud alloleval pildil.
Nii nagu varemgi, teavitatakse sündmuse ülespoole liikumise kõiki elemente selle olemasolust. Niimoodi jätkates peate mõtlema, kas saame protsessi peatada või mitte. Noh, vastus küsimusele on Jah, me võime sündmuse leviku peatada. Seda tehakse kutsudes 'StopPropagation' sündmusobjekti meetod.
html ja xml vahel
window.addEventListener ('click', e => {e.stopPropagation ()}, true) window.addEventListener ('click', kuulaja ('c1'), true) window.addEventListener ('click', kuulaja ('c2 '), true) window.addEventListener (' klõpsa ', kuulaja (' b1 ')) window.addEventListener (' klõps ', kuulaja (' b2 '))Rakendades märksõna, suudame leviku peatada. See töötab nii, kui rakendame märksõna „ stopPropagation ” siis kõiki põhisündmuste all olevaid sündmusi ei kutsuta ja seega neid ei kutsutaks, nagu eespool mainitud koodijupis mainitakse. On veel üks märksõna, mida nimetatakse stopImmediatePropagation ”. Nagu nimigi ütleb, peatab see kohe õdede-vendade menetluse.
Sellega oleme jõudnud oma artikli lõpuni. Loodan, et saite aru, mis on JavaScripti sündmuste mullitamine ja sündmuste jäädvustamine.
Nüüd, kui olete teadnud JavaScripti sündmuste mullitamisest ja sündmuste hõivamisest, vaadake järgmist autor Edureka. Veebiarenduse sertifitseerimiskoolitus aitab teil õppida, kuidas luua muljetavaldavaid veebisaite HTML5, CSS3, Twitter Bootstrap 3, jQuery ja Google API-de abil ning juurutada see Amazon Simple Storage Service'i (S3).
Kas teil on meile küsimus? Palun mainige seda kommentaaride jaotises jaotises „Sündmuste mullitamine ja sündmuste jäädvustamine JavaScripti kaudu” ja me võtame teiega ühendust.