setAttribute() Yöntem, belirli bir öğeye bir öznitelik ayarlamak veya eklemek için kullanılır ve ona bir değer sağlar. Nitelik zaten mevcutsa, yalnızca niteliğin değerini ayarlar veya değiştirir. Yani şunu da kullanabiliriz: setAttribute() Mevcut özelliğin değerini güncelleme yöntemi. İlgili öznitelik mevcut değilse, belirtilen ad ve değerle yeni bir öznitelik oluşturulacaktır. Bu yöntem herhangi bir değer döndürmez. Özellik adı, onu bir HTML öğesinde kullandığımızda otomatik olarak küçük harfe dönüştürülür.
Her ne kadar şunu ekleyebilirsek de stil özelliğini kullanarak setAttribute() yöntemidir, ancak bu yöntemin şekillendirme için kullanılmaması önerilir. Stil eklemek için stil nesnesinin stili etkili bir şekilde değiştirecek özelliklerini kullanabiliriz. Aşağıdaki kodla netleşebilir.
Yanlış yol
Stili değiştirmek için kullanılmaması tavsiye edilir.
element.setAttribute('style', 'background-color: blue;');
Doğru yol
kabin algoritması
Stili değiştirmenin doğru yolu aşağıda verilmiştir.
element.setAttribute.backgroundColor = 'blue';
Bir özelliğin değerini elde etmek için şunu kullanabiliriz: getAttribute() yöntemini kullanabiliriz ve bir öğeden belirli bir özelliği kaldırmak için şunu kullanabiliriz: Özelliği kaldır() yöntem.
kıvılcım öğretici
Eğer gibi bir Boolean niteliği ekliyorsak engelli , o zaman sahip olduğu değer ne olursa olsun, her zaman şu şekilde kabul edilir: doğru . Boolean niteliğinin değerini şu şekilde ayarlamamız gerekirse: YANLIŞ kullanarak özelliğin tamamını kaldırmamız gerekir. Özelliği kaldır() yöntem .
Sözdizimi
element.setAttribute(attributeName, attributeValue)
Bu yöntemin argümanları isteğe bağlı değildir. Bu yöntem kullanılırken her iki parametrenin de dahil edilmesi gerekir. Bu yöntemin parametre değerleri aşağıdaki gibi tanımlanmıştır.
Parametre Değerleri
özellikAdı: Bir elemente eklemek istediğimiz özelliğin adıdır. Boş bırakılamaz; yani isteğe bağlı değildir.
özellik Değeri: Bir elemente eklediğimiz özelliğin değeridir. Ayrıca isteğe bağlı bir değer değildir.
Nasıl kullanılacağını anlayalım setAttribute() bazı illüstrasyonlar kullanarak yöntem.
Örnek 1
Bu örnekte, bir ekliyoruz href değeri olan özellik 'https://www.javatpoint.com/' -e ile etiketle kimlik = 'bağlantı' .
JavaScript setAttribute() method function fun() { document.getElementById('link').setAttribute('href', 'https://www.javatpoint.com/'); } <h2> It is an example of adding an attribute using the setAttribute() method. </h2> <a id="link"> javaTpoint.com </a> <p> Click the follwing button to see the effect. </p> Add attributeŞimdi Test Edin
Çıktı
android'de gizli uygulamalar nasıl bulunur
Yukarıdaki kodun yürütülmesinden sonra çıktı şu şekilde olacaktır:
Verilen düğmeye tıklamadan önce bağlantının oluşturulmadığını görebiliriz. Butona tıkladıktan sonra çıktı şu şekilde olacaktır:
Artık bağlantının oluşturulduğunu görebiliriz.
Örnek2
Bu örnekte, mevcut bir özelliğin değerini kullanarak güncelliyoruz. setAttribute() yöntem. Burada bir metin alanını değerini değiştirerek düğmeye dönüştürüyoruz. tip nitelik metin ile düğme .
jdbc
Efekti görmek için belirtilen düğmeye tıklamamız gerekiyor.
JavaScript setAttribute() method function fun() { document.getElementById('change').setAttribute('type', 'button'); } <h2> It is an example to update an attribute's value using the setAttribute() method. </h2> <p> Click the follwing button to see the effect. </p> ChangeŞimdi Test Edin
Çıktı
Yukarıdaki kodun yürütülmesinden sonra çıktı şu şekilde olacaktır:
Butona tıkladıktan sonra çıktı şu şekilde olacaktır:
Örnek3
Burada Boolean niteliğini ekliyoruz engelli Belirtilen düğmeyi devre dışı bırakmak için. değerini ayarlarsak engelli özniteliği boş bir dizeye dönüştürürseniz, otomatik olarak true değerine ayarlanır ve bu da düğmenin devre dışı bırakılmasına neden olur.
JavaScript setAttribute() method function fun() { document.getElementById('btn').setAttribute('disabled', ''); } <h2> Example of the setAttribute() method. </h2> <p> Click the following button to see the effect </p> Click meŞimdi Test Edin
Çıktı
en güzel gülümseme
Yukarıdaki kodun yürütülmesinden sonra çıktı şu şekilde olacaktır:
Butona tıkladıktan sonra çıktı şu şekilde olacaktır: