' para sa talata, '
' para sa unang antas ng heading, atbp. Ang diskarte na ito ay kinakailangan kapag ang user ay kailangang mag-access ng HTML element sa pamamagitan ng pangalan ng tag nito direkta sa halip na maghanap ng maraming linya ng code.
Ipapaliwanag ng gabay na ito ang kumpletong pamamaraan upang kunin ang pangalan ng tag ng isang elemento ng HTML gamit ang JavaScript.
Paano Kunin ang Tag Name ng isang HTML Element Gamit ang JavaScript?
Nag-aalok ang JavaScript ng read-only na ' tagName ” property na nagpapakita ng tag name ng kaukulang HTML element. Nagbabalik ito ng string value i.e., ang pangalan ng tag ng elemento sa UPPERCASE.
Syntax
elemento. tagName
Sa syntax sa itaas, ' tagName ” ay tumutugma sa mga pangalan ng tag ng elemento na kailangang kunin.
Ngayon, lumipat tayo sa praktikal na pagpapatupad nito upang suriin kung paano ito magagamit upang kunin ang pangalan ng tag ng kaukulang elemento ng HTML.
Halimbawa: Paglalapat ng 'tagName' Property para Kunin ang Tag Name ng isang HTML Element
Sa halimbawang ito, ang lahat ng mga pangalan ng tag ng elemento na tinukoy sa HTML code ay maaaring makuha sa pamamagitan ng ' tagName ” ari-arian.
HTML Code
Tingnan natin ang sumusunod na HTML code:
< katawan onclick = 'elemName()' >< h2 > Kunin ang tagName ng HTML Element Sa JavaScript < / h2 >
< p > Mag-click sa anumang elemento sa dokumentong ito upang makuha ang pangalan ng tag nito. < / p >
< pindutan > I-click ito < / pindutan >
< p id = 'demo' >< / p >
Sa itaas na mga linya ng code:
- Ang '
Ang 'tag ay nauugnay sa isang ' onclick ' event na nagre-redirect sa JavaScript function ' elemName() ” na ma-trigger sa isang pag-click. - Ang ' Tinutukoy ng tag na ” ang subheading.
- Ang ' ” tag ay lumilikha ng isang talata na pahayag.
- Ang ' Ang tag ng ” ay nagdaragdag ng isang button na pinangalanang “I-click Ito”.
- Panghuli, ang ' Tinutukoy ng tag na 'ang isang walang laman na talata na mayroong isang id' demo ” upang ipakita ang pangalan ng tag ng HTML element sa trigger ng event na “onclick”.
JavaScript Code
Susunod na lumipat sa ibinigay na code sa ibaba:
< iskrip >function elemName ( ) {
const elemento = kaganapan. target ;
dokumento. getElementById ( 'demo' ) . innerHTML = 'Ang na-click na HTML Element tag name ay: ' + elemento. tagName ;
}
iskrip >
Sa block ng code na ito:
- Tukuyin ang isang function na pinangalanang ' elemName() ”.
- Sa kahulugan nito, ipahayag ang variable na ' elemento 'ng uri ng data' const 'na gumagamit ng' target ” property upang ibalik ang pangalan ng elemento kapag nag-trigger ang nauugnay na kaganapan nito.
- Panghuli, ilapat ang ' getElementById() ” paraan upang ma-access ang idinagdag na talata gamit ang id nito.
- Magreresulta ito sa pagpapakita ng pangalan ng tag ng kaukulang elemento ng HTML gamit ang “ tagName ” property kapag gagana ang event na “onclick”.
- Ito ay tulad na sa pag-click sa alinman sa mga elemento sa HTML code, ang katumbas na pangalan ng tag ay kukunin.
Output
Ipinapakita ng output ang katumbas na pangalan ng tag ng elemento kung saan gumagana ang kaganapang 'onclick' nang naaayon.
Konklusyon
Nagbibigay ang JavaScript ng built-in na ' tagName ” property para sa pagkuha ng HTML element tag name. Ito ay karaniwang ginagamit sa mga tagapangasiwa ng kaganapan ng JavaScript tulad ng 'onclick', 'onmouseover', 'ondblclick' atbp. Kapag gumana ang nauugnay na kaganapan ng elemento ng HTML, ibinabalik nito ang pangalan ng tag nito sa UPPERCASE bilang default. Ang gabay na ito ay nagbigay ng maikling paglalarawan kung paano kunin ang tag name ng isang HTML element gamit ang JavaScript.