Hva er arrangement.mål i JavaScript?

Hva er arrangement.mål i JavaScript?
En "begivenhet”Forekommer når tilstanden til et objekt endres. Brukeraktiviteter, for eksempel å trykke på en hvilken som helst tast eller klikke på musen, kan føre til at hendelser oppstår. Det er noen egenskaper ved en hendelse i JavaScript som hjelper til med å håndtere funksjoner. “begivenhet.mål”Er en av dem som identifiserer hvilket spesifikt element som ble utløst arrangementet.

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)
konsoll.Logg (hendelse.mål)
)

I den gitte syntaks,

  • AddEventListener ()”Metode brukes til å legge til en hendelsesbehandler for det spesifikke elementet.
  • “”Indikerer enhver hendelse, for eksempel“Klikk”,“mus over", og så videre.

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)
konsoll.Logg ('Målhendelse:', hendelse.mål);
);

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');
knapp.AddEventListener ('klikk', funksjon (hendelse)
begivenhet.mål.stil.BakgrunnColor = "Blå";
);

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) =>
dokument.getElementById ("Show").INNERHTML = hendelse.mål.verdi;
)

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.