Bu yazımda JavaScript Html DOM metodlarından olan hasAttribute() ve removeAttribute() metodlarının ne işe yaradıklarını ve nasıl kullanıldıklarını anlatacağım.
Html DOM hasAttribute() Metodu
hasAttribute() metodu ile bir Html öğesinde aradığımız bir niteliğin olup olmadığını öğrenebiliriz. Eğer aradığımız nitelik varsa true yoksa false değeri döndürülür.
Örneğin bir button etiketi tanımlayalım ve bu etikete şu nitelikleri verelim.
- type
- id
- class
Sonrasında hasAttribute() metodu ile sırasıyla id ve href niteliğinin olup olmadığını kontrol edelim. Sonucu da console ekranına yazdıralım.
|
1 2 3 4 5 6 7 8 9 10 |
<button type="submit" id="submitBtn" class="btn btn-info">Gönder</button> <script> let btn = document.getElementById("submitBtn"); console.log(btn.hasAttribute("id")); console.log(btn.hasAttribute("href")); </script> |
Çıktısı :
true
false
Gördüğünüz gibi hasAttribute() metodu, içerisine yazdığımız niteliğin ismine göre varsa true yoksa false değeri döndürüyor.
⇒ hasAttribute() metodu IE 9.0 sonrası 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
Html DOM removeAttribute() Metodu
removeAttribute() metodu ile bir Html öğesinden istediğimiz bir niteliği silebiliriz. Örneğin bir button etiketi tanımlayalım ve bu etikete şu nitelikleri verelim.
- type
- id
- class
Sonrasında removeAttribute() metodu ile class niteliğini silelim. Html öğesinin son halini de console ekranına yazdıralım.
|
1 2 3 4 5 6 7 8 9 10 |
<button type="submit" id="submitBtn" class="btn btn-info">Gönder</button> <script> let btn = document.getElementById("submitBtn"); btn.removeAttribute("class"); console.log(btn); </script> |
Çıktısı : <button type=”submit” id=”submitBtn”>Gönder</button>
Gördüğünüz gibi removeAttribute() metodu ile Html öğesinin class niteliğini silmiş olduk.
⇒ removeAttribute() metodu IE ve tüm modern tarayıcılar tarafından desteklenir.
Umarım “JavaScript Html DOM hasAttribute(), removeAttribute() Metodları ve Kullanımları” başlıklı yazım sizin için faydalı olmuştur.
Şu yazılar da ilginizi çekebilir.
JavaScript Html DOM attributes Kullanımı
Yeni bir yazımda görüşmek üzere.
, removeAttribute() Metodları ve Kullanımları){kind=link}