Sådan henter du tagnavnet på et HTML-element ved hjælp af JavaScript

Sadan Henter Du Tagnavnet Pa Et Html Element Ved Hjaelp Af Javascript



HTML-elementer er de væsentlige komponenter på en webside, der definerer dens struktur såvel som indhold ved hjælp af dens tagnavn. Tagnavnet instruerer browseren i, hvordan indholdet skal fortolkes som '

' for afsnit, '

' for overskriften på første niveau osv. Denne tilgang er nødvendig, når brugeren skal have adgang til et HTML-element ved dets tagnavn direkte i stedet for at søge flere linjer kode.

Denne vejledning vil forklare den komplette procedure for at hente tagnavnet på et HTML-element ved hjælp af JavaScript.

Hvordan henter man tagnavnet på et HTML-element ved hjælp af JavaScript?

JavaScript tilbyder skrivebeskyttet ' tagnavn ” egenskab, der viser tagnavnet på det tilsvarende HTML-element. Det returnerer en strengværdi, dvs. elementets tagnavn med STORE BOKSTAVER.







Syntaks



element. tagnavn

I ovenstående syntaks, ' tagnavn ' svarer til elementets tagnavne, der skal hentes.



Lad os nu gå videre til dens praktiske implementering for at kontrollere, hvordan den kan bruges til at hente tagnavnet på det tilsvarende HTML-element.





Eksempel: Anvendelse af egenskaben 'tagName' til at hente tagnavnet på et HTML-element

I dette eksempel kan alle elementets tagnavne angivet i HTML-koden hentes via ' tagnavn ” ejendom.



HTML kode

Lad os se på følgende HTML-kode:

< legeme onclick = 'elemName()' >
< h2 > Hent tagnavn på HTML-element i JavaScript < / h2 >
< s > Klik på ethvert element i dette dokument for at få dets tagnavn. < / s >
< knap > Klik på det < / knap >
< s id = 'demo' >< / s >

I ovenstående kodelinjer:

  • Det ' ' tag er knyttet til et ' onclick ' hændelse omdirigerer til JavaScript-funktionen ' elemName() ”, der udløses ved et klik.
  • Det '

    ” tag definerer underoverskriften.

  • Det '

    ” tag opretter en afsnitssætning.

  • Det ' ” tag tilføjer en knap ved navn “Klik på den”.
  • Til sidst, '

    ' tag definerer et tomt afsnit med et id ' demo ' for at vise HTML-elementets tagnavn på 'onclick'-hændelsesudløseren.

JavaScript kode

Gå derefter videre til nedenstående kode:

< manuskript >
fungere elem Navn ( ) {
konst element = begivenhed. mål ;
dokument. getElementById ( 'demo' ) . indreHTML = 'Det klikkede HTML-element-tagnavn er:  ' + element. tagnavn ;
}
manuskript >

I denne kodeblok:

  • Definer en funktion ved navn ' elemName() ”.
  • I sin definition skal du erklære variablen ' element ' af datatype ' konst ', der bruger ' mål ” egenskab for at returnere elementnavnet, når dets tilknyttede hændelse udløses.
  • Til sidst skal du anvende ' getElementById() ” metode for at få adgang til det tilføjede afsnit ved hjælp af dets id.
  • Det vil resultere i visning af tagnavnet på det tilsvarende HTML-element ved hjælp af ' tagnavn ” egenskab, når “onclick”-hændelsen udløses.
  • Det er sådan, at ved at klikke på et af elementerne i HTML-koden, vil det tilsvarende tagnavn blive hentet.

Produktion

Outputtet viser det tilsvarende element-tagnavn, hvor 'onclick'-hændelsen udløses tilsvarende.

Konklusion

JavaScript giver den indbyggede ' tagnavn ” egenskab til at hente HTML-elementets tagnavn. Det bruges generelt med JavaScript-hændelseshandlere som 'onclick', 'onmouseover', 'ondblclick' osv. Når den tilknyttede hændelse af HTML-elementet udløses, returnerer den som standard sit tagnavn med STORE BOKSTAVER. Denne vejledning har givet en kort beskrivelse af, hvordan man henter tagnavnet på et HTML-element ved hjælp af JavaScript.