Html kontrollerinin en çok kullandığımız attribute yani özelliklerini javascript tarafında nasıl değiştireceğimizi ve nasıl attribute ekleyeceğimizi görmüş olacağız bu makalemizde.
Javascript ile attribute ekleme ve değiştirme
Örneklerimizde html kontrollerinden olan button nesnesini kullanacağız.
Alttaki gibi bir button nesnesi oluşturalım button nesnesini isterseniz input ile oluşturabilir istersenizde button nesnesini kullanarak buton oluşturabilirsiniz her ikisinin kullanımı ve örneği alttaki kodumuzda yer almaktadır.
Örnek Kodlar
1 2 | <input type="button" id="btntest" value="Test Butonu"/> <button id="btntest">Test Butonu</button> |
Şimdi ise eklediğimiz button nesnesine disabled attribute’sini ekleyip buttonu etkisiz hale getirelim ve button’un yazısınıda ‘Yazı Değişti’ olarak değiştireceğimiz javascript kodu ise alttaki gibidir.
Örnek Kodlar
1 2 3 | var button = document.getElementById('btntest'); button.disabled = 'disabled'; button.value = 'Yazı Değişti'; |
İsterseniz bu attribute eklemeyi javascript’de metod ilede gerçekleştirebilirsiniz şimdi üstteki kodu metodla yazalım.
1 2 3 | var button = document.getElementById('btntest'); button.setAttribute('disabled','disabled'); button.setAttribute('value','Yazı Değişti'); |
Kodların sonucunu görmek için alttaki aracımıza gözatabilir ve kodlar üzerinde oynama yaparak olayı daha iyi kavrayabilirsiniz.
