Dette innlegget vil illustrere “hendelsen.mål ”og bruken i JavaScript.
Hva er “Event.mål ”i JavaScript?
“begivenhet.mål”Er en eiendom/attributt av“begivenhet”I JavaScript. Det refererer til elementet som utløste hendelsen. For å få tilgang til arrangementet.Målattributt, elementets hendelse må lyttes til. “AddEventListener ()”Metoden brukes til å lytte til den spesifikke hendelsen.
Syntaks
For å bruke “hendelsen.Target ”-egenskaper, følg den gitte syntaks:
element.AddEventListener ("", funksjon (hendelse)I den gitte syntaks,
Eksempel
I det gitte eksemplet vil vi få elementet som utløste hendelsen ved å bruke "begivenhet.mål”Eiendom.
Her oppretter vi en knapp ved å tilordne en ID “btn”Som brukes i JavaScript for tilgang til knappen:
I JavaScript -filen får vi først referansen til knappen ved å bruke den tildelte ID -en ved hjelp av "getElementById ()”Metode:
const -knapp = dokument.getElementById ('btn');Fest en hendelseslytter med knappen. “Klikk”Arrangementet initieres på knappens klikk, og hendelsesobjektet sendes til hendelseslytteren som et argument. “begivenhet.mål”Attributt er tilgjengelig fra lytterfunksjonen for å få en referanse til knappelementet som utløste hendelsen:
knapp.AddEventListener ('klikk', funksjon (hendelse)Utgangen viser referansen til den spesifikke knappen som er klikket:
Du kan få mer informasjon og bruke forskjellige funksjoner som styling på den målrettede hendelsen ved å bruke attributtene.
Hva er attributtene til “Event.mål"?
Det er forskjellige attributter for "hendelsen.mål ”-egenskaper som gir informasjon om målelementet. Få av de vanlige attributtene til arrangementet.Målobjektet er som følger:
begivenhet.målattributter | Beskrivelse |
begivenhet.mål.tagname | Brukt til å få “Navn”Av HTML -taggen til målelementet. |
begivenhet.mål.verdi | Bruk for å hente "verdi”Av målelementet. Denne attributtet brukes for det meste til inngangselementer. |
begivenhet.mål.id | For å få “id”Attributt til målelementet, bruk den gitte attributtet. |
begivenhet.mål.Klasseliste | Listen over “klasser”Inneholder målelementet får tilgang til dette attributtet. |
begivenhet.mål.Tekstkonkurranse | Brukt til å få “tekstinnhold”Av målelementet. |
begivenhet.mål.href | Denne attributtet henter “href”Attributt til målelementet, for eksempel lenker. |
begivenhet.mål.stil | For å endre “CSS”Eiendom til målelementet, bruk dette attributtet. |
Eksempel 1: Endre bakgrunnsfargen på målelementet
I det angitte eksemplet vil vi endre bakgrunnsfargen på målelementet ved å bruke "stil”Attributt på“Klikk" begivenhet:
const -knapp = dokument.getElementById ('btn');Produksjon
Eksempel 2: Få verdien av målelementet
Lag et inngangstekstfelt og et område for å vise tekst ved hjelp av
stikkord. Tilordne ID -er til inngangsfeltet og
tag som "TakeInput”Og“forestilling”, Henholdsvis:
Få referanse til tekstfeltet ved å bruke “getElementById ()”Metode:
var input = dokument.getElementById ("TakeInput");Bruke "verdi”Attributt med“begivenhet.mål”For å få verdien av det målrettede elementet:
inngang.AddEventListener ("input", (hendelse) =>Som du kan se at verdien som er lagt inn i tekstboksen er hentet med hell ved å bruke "verdi" Egenskap:
Det handlet om “hendelsen.mål ”i JavaScript.
Konklusjon
“begivenhet.mål”Refererer til elementet som utløste/initierte hendelsen. Det er noen attributter for "hendelsen.mål ”-egenskaper som gir informasjon om målelementet. For eksempel, "begivenhet.mål.tagname”,“.verdi”,“.id”,“.stil", og så videre. Dette innlegget illustrerte “hendelsen.mål ”, dets attributter og bruken av den i JavaScript.