Metoda html

Metoda html umožňuje měnit text elementu a získat jej spolu s tagy.

Syntaxe

Získání textu:

javascript$(selektor).html();

Změna textu:

javascript$(selektor).html(nový text);

Další informace

Metoda html může aplikovat zadanou funkci na každý prvek v sadě. Prvním parametrem funkce obdrží číslo prvku v sadě a druhým parametrem - aktuální text prvku:

javascript$(selektor).html(function(číslo v sadě, aktuální text prvku));

Názvy proměnných ve funkci mohou být libovolné. Například, pokud pro první parametr dáme název index - pak uvnitř naší funkce bude dostupná proměnná index, ve které bude ležet číslo v sadě pro ten prvek, který funkce zpracovává v daném čase. Podobně, pokud pro druhý parametr dáme, například, název value - pak uvnitř naší funkce bude dostupná proměnná value, ve které bude ležet text toho prvku, který funkce zpracovává v daném čase:

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

  // zde jsou dostupné proměnné index a value
  
});

Text každého prvku se změní na ten, který vrátí funkce konkrétně pro tento prvek.

Příklad

Pojďme zobrazit na obrazovku obsah našeho odstavce:

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

javascriptlet text = $('#test').html();
alert(text);

Příklad

Pojďme změnit obsah našeho odstavce:

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

javascript$('#test').html('text2');

HTML kód bude vypadat takto:

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

Příklad

Pojďme změnit obsah našeho odstavce na text s tagy:

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

javascript$('#test').html('<span>text2</span>');

HTML kód bude vypadat takto:

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

Příklad

Pojďme každému odstavci přidat na konec jeho pořadové číslo v sadě:

html<p>text</p>
<p>text</p>
<p>text</p>

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

HTML kód bude vypadat takto:

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

Viz také