JavaScript Html DOM attributes Kullanımı

Bu yazımda JavaScript Html DOM özelliklerinden olan attributes kullanımını anlatacağım.

Attributes özelliği ile bir Html öğesindeki tüm niteliklere erişebiliriz. Tüm niteliklere eriştikten sonra bu niteliklerin sayısını, isimlerini veya değerlerini öğrenmek için bazı ek özelliklere ihtiyacımız var. 

Attributes özelliği ile birlikte şu 3 özelliği de kullanabiliyoruz.

Örneğin bir input etiketi tanımlayalım. Bu etikete şu nitelikleri verelim.

  • type
  • id
  • class
  • placeholder
  • required

Sonrasında input etiketinin toplam attribute sayısını console ekranına yazdıralım.

 Çıktısı :  5

 ⇒  attributes.length özelliği IE ve tüm modern tarayıcılar tarafından desteklenir.

Html öğelerine erişim metodları hakkında detaylı bilgi için şu yazılarımı okuyabilirsiniz.

JavaScript Html DOM Erişim Yöntemleri – 1

JavaScript Html DOM Erişim Yöntemleri – 2

 2 –  attribute.name Özelliği : Bu özellik ile bir Html öğesinin niteliklerinin isimlerini öğrenebiliriz.

Örneğin bir input etiketi tanımlayalım. Bu etikete şu nitelikleri verelim.

  • type
  • id
  • class
  • placeholder
  • required

Sonrasında input etiketinin tüm niteliklerine erişip isimlerini console ekranına yazdıralım.

 Çıktısı :  

type

id

class

placeholder

required

 ⇒  attributes.name özelliği IE ve tüm modern tarayıcılar tarafından desteklenir.

Örneğin bir input etiketi tanımlayalım. Bu etikete şu nitelikleri verelim.

  • type
  • id
  • class
  • placeholder

Sonrasında input etiketinin tüm niteliklerine erişip değerlerini console ekranına yazdıralım.

 Çıktısı :  

text

nameId

nameClass

Lütfen isminizi giriniz

 ⇒  attributes.value özelliği IE ve tüm modern tarayıcılar tarafından desteklenir.

Son olarak attributes özelliği ile ilgili bir konuya daha değinmek istiyorum.

Yine bir input etiketi tanımlayalım ve aynı nitelikleri verelim.

Sonrasında attributes özelliği ile bu input’un tüm niteliklerine erişelim. Bu niteliklerin içerisinden istediğimiz bir niteliğe erişmek için niteliğin adını kullanabildiğimiz gibi niteliğin index numarasını da kullanabiliriz.

 Çıktısı : 

nameClass

nameClass

Gördüğünüz gibi nitelik adını (class) yazdığımızda da index numarasını (2) yazdığımızda da aynı sonucu alıyoruz.

Umarım “JavaScript Html DOM attributes Kullanımı” başlıklı yazım sizin için faydalı olmuştur.

Şu yazılar da ilginizi çekebilir.

Tüm Html Nitelikleri ve Kullanılabildikleri Html Etiketleri

Yeni bir yazımda görüşmek üzere.

Yorum Yazın

650+ ABONE ARASINA KATIL

Adını ve E-Posta adresini yazarak Html, Css, Javascript, Jquery, Bootstrap, Web Tasarım, C#, Bilgisayar, Telefon, Android, Veri Güvenliği ve daha birçok alanda ders anlatımlarından ve uygulamalı örneklerden anında haberdar olabilirsin.

Abone olduğunuz için teşekkürler.

Birşeyler yanlış gitti.