JavaScript Kullanarak Bir HTML Öğesinin Etiket Adını Alma

Javascript Kullanarak Bir Html Ogesinin Etiket Adini Alma



HTML öğeleri, etiket adının yardımıyla içeriğini olduğu kadar yapısını da tanımlayan bir web sayfasının temel bileşenleridir. Etiket adı, tarayıcıya paragraf için '

', birinci düzey başlık için '

' gibi içeriği nasıl yorumlayacağını bildirir. Bu yaklaşım, kullanıcının bir HTML öğesine etiket adıyla erişmesi gerektiğinde gereklidir. birden fazla kod satırı aramak yerine doğrudan.

Bu kılavuz, JavaScript kullanarak bir HTML öğesinin etiket adını alma prosedürünün tamamını açıklayacaktır.

JavaScript Kullanarak Bir HTML Öğesinin Etiket Adını Nasıl Getiririm?

JavaScript salt okunur ' etiket adı İlgili HTML öğesinin etiket adını görüntüleyen özellik. Bir dize değeri, yani öğenin BÜYÜK HARF içindeki etiket adı döndürür.







Sözdizimi



eleman. etiket adı

Yukarıdaki sözdiziminde, “ etiket adı ”, öğenin getirilmesi gereken etiket adlarına karşılık gelir.



Şimdi, ilgili HTML öğesinin etiket adını getirmek için nasıl kullanılabileceğini kontrol etmek için pratik uygulamasına geçelim.





Örnek: Bir HTML Öğesinin Etiket Adını Almak için 'tagName' Özelliğini Uygulama

Bu örnekte, HTML kodunda belirtilen öğenin tüm etiket adları, ' etiket adı ' mülk.



HTML Kodu

Aşağıdaki HTML koduna bir göz atalım:

< vücut tıklamada = 'öğeAdı()' >
< h2 > JavaScript'te HTML Elemanının tagName'ini getir < / h2 >
< P > Etiket adını almak için bu belgedeki herhangi bir öğeye tıklayın. < / P >
< düğme > Tıkla < / düğme >
< P İD = 'demo' >< / P >

Yukarıdaki kod satırlarında:

  • ” etiketi bir “ ile ilişkilidir. tıklamada 'JavaScript işlevine yönlendiren olay' elemAdı() ” bu bir tıklamayla tetiklenecek.
  • ” etiketi alt başlığı tanımlar.

  • ” etiketi bir paragraf cümlesi oluşturur.

  • ” etiketi, “Tıkla” adında bir düğme ekler.
  • Son olarak, “

    ” etiketi, kimliği olan boş bir paragrafı tanımlar” gösteri ”, “onclick” olay tetikleyicisinde HTML öğesi etiket adını görüntülemek için.

JavaScript Kodu

Ardından, aşağıda sağlanan koda geçin:

< senaryo >
işlev elemAdı ( ) {
sabit eleman = etkinlik. hedef ;
belge. getElementById ( 'demo' ) . içHTML = 'Tıklanan HTML Öğesi etiket adı:  ' + eleman. etiket adı ;
}
senaryo >

Bu kod bloğunda:

  • “ adlı bir işlev tanımlayın. elemAdı() ”.
  • Tanımında, ' değişkenini bildirin. eleman 'veri türü' sabit ' kelimesini kullanan ' hedef İlişkili olayı tetiklendiğinde öğe adını döndürmek için ” özelliği.
  • Son olarak, “ getElementById() Eklenen paragrafa kimliğini kullanarak erişmek için ” yöntemi.
  • Karşılık gelen HTML öğesinin etiket adının '' kullanılarak görüntülenmesiyle sonuçlanacaktır. etiket adı ” özelliği, “onclick” olayı tetiklendiğinde.
  • Öyle ki, HTML kodundaki herhangi bir öğeye tıklandığında, karşılık gelen etiket adı alınacaktır.

Çıktı

Çıktı, 'onclick' olayının buna göre tetiklendiği ilgili öğe etiketi adını gösterir.

Çözüm

JavaScript, yerleşik ' etiket adı HTML öğesi etiket adını almak için ” özelliği. Genellikle “onclick”, “onmouseover”, “ondblclick” gibi JavaScript olay işleyicileri ile kullanılır. HTML öğesinin ilişkili olayı tetiklendiğinde, etiket adını varsayılan olarak BÜYÜK HARF olarak döndürür. Bu kılavuz, JavaScript kullanarak bir HTML öğesinin etiket adının nasıl getirileceğine dair kısa bir açıklama sağlamıştır.