Metoda html
Metoda html permite modificarea textului
elementului și obținerea acestuia împreună cu tag-urile.
Sintaxă
Obținerea textului:
$(selector).html();
Modificarea textului:
$(selector).html(text nou);
Informații suplimentare
Metoda html poate aplica o funcție dată
fiecărui element din set.
În acest caz, primul parametru al funcției va primi
numărul elementului din set, iar al doilea parametru
- textul curent al elementului:
$(selector).html(function(număr în set, text curent al elementului));
Numele variabilelor în funcție pot fi orice.
De exemplu, dacă pentru primul parametru dăm numele
index - atunci în interiorul funcției noastre va fi disponibilă
variabila index, în care va fi numărul din
set pentru acel element pe care funcția îl procesează
în acest moment. Similar, dacă pentru al doilea
parametru dăm, de exemplu, numele value - atunci
în interiorul funcției noastre va fi disponibilă variabila value,
în care va fi textul acelui element pe care funcția
îl procesează în acest moment:
$(selector).html(function(index, value) {
// aici sunt disponibile variabilele index și value
});
Textul fiecărui element se va schimba cu cel pe care funcția îl returnează pentru acel element în particular.
Exemplu
Să afișăm pe ecran conținutul paragrafului nostru:
<p id="test">text</p>
let text = $('#test').html();
alert(text);
Exemplu
Să schimbăm conținutul paragrafului nostru:
<p id="test">text1</p>
$('#test').html('text2');
Codul HTML va arăta astfel:
<p id="test">text2</p>
Exemplu
Să schimbăm conținutul paragrafului nostru cu text care conține tag-uri:
<p id="test">text1</p>
$('#test').html('<span>text2</span>');
Codul HTML va arăta astfel:
<p id="test"><span>text2</span></p>
Exemplu
Să adăugăm la sfârșit fiecărui paragraf numărul său de ordine în set:
<p>text</p>
<p>text</p>
<p>text</p>
$('p').html(function(index, value){
return value + ' ' + index;
});
Codul HTML va arăta astfel:
<p>text 0</p>
<p>text 1</p>
<p>text 2</p>
Vezi și
-
metoda
text,
care permite obținerea textului elementului fără tag-uri -
Proprietatea JavaScript
innerHTML,
cu ajutorul căreia puteți schimba textul elementului în JavaScript pur -
Proprietatea JavaScript
outerHTML,
cu ajutorul căreia puteți modifica textul elementului împreună cu tag-ul său în JavaScript pur
