Metode html

Metode html ļauj mainīt elementa tekstu un iegūt to kopā ar tagiem.

Sintakse

Teksta iegūšana:

javascript$(selektors).html();

Teksta maiņa:

javascript$(selektors).html(jauns teksts);

Papildus

Metode html var pielietot noteikto funkciju katram elementam kopā. Šajā gadījumā pirmais parametrs funkcijā tiks iegūts elementa numurs kopā, bet otrais parametrs - pašreizējais elementa teksts:

javascript$(selektors).html(function(numurs kopā, pašreizējais elementa teksts));

Mainīgo nosaukumi funkcijā var būt jebkādi. Piemēram, ja pirmajam parametram mēs dosim nosaukumu index - tad mūsu funkcijā būs pieejams mainīgais index, kurā atradīsies numurs kopā tam elementam, kuru funkcija apstrādā šajā brīdī. Līdzīgi, ja otrajam parametram dosim, piemēram, nosaukumu value - tad mūsu funkcijā būs pieejams mainīgais value, kurā atradīsies tā elementa teksts, kuru funkcija apstrādā šajā brīdī:

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

  // šeit ir pieejami mainīgie index un value
  
});

Katras elementa teksts tiks mainīts uz to, ko funkcija atgriezīs tieši šim elementam.

Piemērs

Izvadīsim uz ekrāna mūsu rindkopas saturu:

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

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

Piemērs

Mainīsim mūsu rindkopas saturu:

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

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

HTML kods izskatīsies šādi:

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

Piemērs

Mainīsim mūsu rindkopas saturu uz tekstu ar tagiem:

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

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

HTML kods izskatīsies šādi:

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

Piemērs

Katrai rindkopai pievienosim beigās tās kārtas numuru kopā:

html<p>teksts</p>
<p>teksts</p>
<p>teksts</p>

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

HTML kods izskatīsies šādi:

html<p>teksts 0</p>
<p>teksts 1</p>
<p>teksts 2</p>

Skatiet arī