Metod html

Metod html omogućava da menjate tekst elementa i da ga dobijete zajedno sa tagovima.

Sintaksa

Dobijanje teksta:

javascript$(selektor).html();

Menjanje teksta:

javascript$(selektor).html(novi tekst);

Dodatno

Metod html može primeniti zadatu funkciju na svaki element u setu. Pri tome će prvi parametar funkcije dobiti broj elementa u setu, a drugi parametar - trenutni tekst elementa:

javascript$(selektor).html(function(broj u setu, trenutni tekst elementa));

Imena promenljivih u funkciji mogu biti bilo koja. Na primer, ako za prvi parametar damo ime index - onda će unutar naše funkcije biti dostupna promenljiva index, u kojoj će biti broj u setu za onaj element koji funkcija obrađuje u datom trenutku. Slično, ako za drugi parametar damo, na primer, ime value - onda će unutar naše funkcije biti dostupna promenljiva value, u kojoj će biti tekst onog elementa koji funkcija obrađuje u datom trenutku:

javascript$(selektor).html(function(index, value) {

  // ovde su dostupne promenljive index i value

});

Tekst svakog elementa će se promeniti u onaj, koji funkcija vrati konkretno za taj element.

Primer

Hajde da ispišemo na ekran sadržaj našeg pasusa:

html<p id="test">tekst</p>
javascriptlet text = $('#test').html();
alert(text);

Primer

Hajde da promenimo sadržaj našeg pasusa:

html<p id="test">tekst1</p>
javascript$('#test').html('tekst2');

HTML kod će izgledati ovako:

html<p id="test">tekst2</p>

Primer

Hajde da promenimo sadržaj našeg pasusa na tekst sa tagovima:

html<p id="test">tekst1</p>
javascript$('#test').html('<span>tekst2</span>');

HTML kod će izgledati ovako:

html<p id="test"><span>tekst2</span></p>

Primer

Hajde da svakom pasusu dodamo na kraju njegov redni broj u setu:

html<p>tekst</p>
<p>tekst</p>
<p>tekst</p>
javascript$('p').html(function(index, value){
  return value + ' ' + index;
});

HTML kod će izgledati ovako:

html<p>tekst 1</p>
<p>tekst 2</p>
<p>tekst 3</p>

Pogledajte takođe

  • metod text,
    koji omogućava da dobijete tekst elementa bez tagova
  • JavaScript svojstvo innerHTML,
    pomoću kog možete zameniti tekst elementa u čistom JavaScript-u
  • JavaScript svojstvo outerHTML,
    pomoću kog možete izmeniti tekst elementa zajedno sa njegovim tagom u čistom JavaScript-u