html metodu
html metodu, bir elemanın metnini değiştirmeye
ve etiketlerle birlikte almayı sağlar.
Sözdizimi
Metni alma:
javascript$(selektör).html();
Metni değiştirme:
javascript$(selektör).html(yeni metin);
Ek Bilgiler
html metodu, belirtilen bir fonksiyonu
kümedeki her elemana uygulayabilir.
Bu durumda fonksiyon ilk parametre olarak
kümedeki eleman numarasını, ikinci parametre olarak
ise elemanın mevcut metnini alır:
javascript$(selektör).html(function(kümedeki numara, elemanın mevcut metni));
Fonksiyondaki değişken isimleri herhangi bir şey olabilir.
Örneğin, ilk parametreye index adını verirsek -
o zaman fonksiyonumuzun içinde, fonksiyonun o anda işlem yaptığı
elemanın küme içindeki numarasının bulunduğu index
değişkeni erişilebilir olacaktır. Benzer şekilde, ikinci
parametreye örneğin value adını verirsek - o zaman
fonksiyonumuzun içinde, fonksiyonun o anda işlem yaptığı
elemanın metninin bulunduğu value değişkeni
erişilebilir olacaktır:
javascript$(selektör).html(function(index, value) {
// burada index ve value değişkenlerine erişilebilir
});
Her elemanın metni, fonksiyonun o eleman için özel olarak döndürdüğü metinle değişecektir.
Örnek
Paragrafımızın içeriğini ekrana yazdıralım:
html<p id="test">metin</p>javascriptlet text = $('#test').html();
alert(text);
Örnek
Paragrafımızın içeriğini değiştirelim:
html<p id="test">metin1</p>javascript$('#test').html('metin2');
HTML kodu şu şekilde görünecektir:
html<p id="test">metin2</p>
Örnek
Paragrafımızın içeriğini etiketlerle birlikte değiştirelim:
html<p id="test">metin1</p>javascript$('#test').html('<span>metin2</span>');
HTML kodu şu şekilde görünecektir:
html<p id="test"><span>metin2</span></p>
Örnek
Her paragrafa küme içindeki sıra numarasını sonuna ekleyelim:
html<p>metin</p>
<p>metin</p>
<p>metin</p>javascript$('p').html(function(index, value){
return value + ' ' + index;
});
HTML kodu şu şekilde görünecektir:
html<p>metin 0</p>
<p>metin 1</p>
<p>metin 2</p>