Metoda html
Metoda html umožňuje měnit text
elementu a získat jej spolu s tagy.
Syntaxe
Získání textu:
$(selektor).html();
Změna textu:
$(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:
$(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:
$(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:
<p id="test">text</p>
let text = $('#test').html();
alert(text);
Příklad
Pojďme změnit obsah našeho odstavce:
<p id="test">text1</p>
$('#test').html('text2');
HTML kód bude vypadat takto:
<p id="test">text2</p>
Příklad
Pojďme změnit obsah našeho odstavce na text s tagy:
<p id="test">text1</p>
$('#test').html('<span>text2</span>');
HTML kód bude vypadat takto:
<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ě:
<p>text</p>
<p>text</p>
<p>text</p>
$('p').html(function(index, value){
return value + ' ' + index;
});
HTML kód bude vypadat takto:
<p>text 1</p>
<p>text 2</p>
<p>text 3</p>
