Un eveniment este o parte importantă a .O pagină web răspunde în funcție de un eveniment care a avut loc. Unele evenimente sunt generate de utilizatori, iar altele sunt generate de API-uri. În acest articol, vom vedea cum apar evenimentele și cum se folosește metoda addEventListener în JavaScript în următoarea secvență:
- Ce este ascultătorul de evenimente?
- AddEventListener () în JavaScript
- Valorile parametrilor
- AddEventListener în JavaScript: Exemplu
Ce este ascultătorul de evenimente?
Un ascultător de evenimente este o procedură în JavaScript care așteaptă să apară un eveniment. Simplul exemplu al unui eveniment este un utilizator care face clic cu mouse-ul sau apasă o tastă de pe tastatură.
addEventListener () este un inbuilt Funcția JavaScript care ia evenimentul de ascultat și un al doilea argument care trebuie chemat ori de câte ori evenimentul descris este concediat. Orice număr de gestionare de evenimente poate fi adăugat la un singur element fără a suprascrie gestionare de evenimente existente.
addEventListener () în JavaScript
Unele dintre Caracteristici a metodei de ascultare a evenimentelor includ:
- addEventListener () metoda atașează un organizatorul evenimentului la elementul specificat.
- Această metodă atașează un gestionar de evenimente la un element fără suprascriere gestionare de evenimente existente.
- Poti sa adaugi mulți gestionari de evenimente la un singur element.
- Puteți adăuga multe gestionare de evenimente din acelasi tip catre unul element , adică două evenimente de „clic”.
- Ascultătorii de evenimente pot fi adăugați la oricare HOTĂRÂRE obiect nu numai elemente HTML. adică obiectul ferestrei.
- Metoda addEventListener () o face Mai ușor pentru a controla modul în care evenimentul reacționează la clocotire.
Când se utilizează metoda addEventListener (), JavaScript este separat de markup, pentru o mai bună lizibilitate și vă permite să adăugați ascultători de evenimente chiar și atunci când nu controlați marcajul HTML.
De asemenea, puteți elimina cu ușurință un ascultător de evenimente folosind metoda removeEventListener () .
Sintaxă:
target.addEventListener (tip, ascultător [, opțiuni]) target.addEventListener (tip, ascultător [, useCapture]) target.addEventListener (tip, ascultător [, useCapture, wantsUntrusted])
Valorile parametrilor
| Parametru | Descriere |
eveniment | Necesar. Un șir care specifică numele evenimentului. Notă: Nu utilizați prefixul „on”. De exemplu, utilizați „clic” în loc de „onclick”. Pentru o listă a tuturor evenimentelor HTML DOM, consultați referința noastră completă a obiectelor HTML DOM. |
funcţie | Necesar. Specifică funcția de rulat atunci când apare evenimentul. Când apare evenimentul, un obiect eveniment este trecut la funcție ca prim parametru. Tipul evenimentului obiect depinde de evenimentul specificat. De exemplu, evenimentul „clic” aparține obiectului MouseEvent. |
useCapture | Opțional. O valoare booleană care specifică dacă evenimentul ar trebui să fie executat în faza de captare sau în bule. Valori posibile: adevărat - Handlerul de evenimente este executat în faza de captură - Default. Handlerul de evenimente este executat în faza de barbotare |
Acum, că știți cum funcționează un ascultător de evenimente, să aruncăm o privire la un exemplu de addEventListener () în JavaScript.
addEventListener () în JavaScript: Exemplu
& lt! DOCTYPE html & gt & lthtml & gt & ltbody & gt & ltp & gt Acest exemplu folosește metoda addEventListener () pentru a executa o funcție atunci când un utilizator face clic pe un buton. ('myBtn'). addEventListener ('click', myFunction) function myFunction () {document.getElementById ('demo'). innerHTML = 'Hello World'} & lt / script & gt & lt / body & gt & lt / html & gt 
Cu aceasta, ajungem la sfârșitul acestui addEventListener în JavaScript. Sper că ai înțeles cum a ascultat evenimentul metodă funcționează în JavaScript.
Verificați-ne care vine cu instruire live condusă de instructor și experiență în viața reală a proiectului. Această instruire vă face să aveți abilități de a lucra cu tehnologii web back-end și front-end. Include cursuri de dezvoltare web, jQuery, Angular, NodeJS, ExpressJS și MongoDB.
tutorial de programare sas pentru începători
Ai o întrebare pentru noi? Vă rugăm să o menționați în secțiunea de comentarii a blogului „addEventListener în JavaScript” și vă vom răspunde.