Метод html

Методът html позволява да променяте текста на елемент и да го получавате заедно с таговете.

Синтаксис

Получаване на текст:

javascript$(селектор).html();

Промяна на текст:

javascript$(селектор).html(нов текст);

Допълнително

Методът html може да приложи зададена функция към всеки елемент в набора. При това първият параметър функцията получава номера на елемента в набора, а вторият параметър - текущия текст на елемента:

javascript$(селектор).html(function(номер в набор, текущ текст на елемент));

Имената на променливите във функцията могат да бъдат всякакви. Например, ако за първия параметър дадем име index - тогава във нашата функция ще бъде достъпна променливата index, в която ще се намира номерът в набора за този елемент, който функцията обработва в дадения момент.Аналогично, ако за втория параметър дадем, например, име value - тогава във нашата функция ще бъде достъпна променливата value, в която ще се намира текстът на този елемент, който функцията обработва в дадения момент:

javascript$(селектор).html(function(index, value) {

  // тук са достъпни променливите index и value
  
});

Текстът на всеки елемент ще се промени на този, който функцията върне конкретно за този елемент.

Пример

Нека изведем на екрана съдържанието на нашия параграф:

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

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

Пример

Нека променим съдържанието на нашия параграф:

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

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

HTML кодът ще изглежда така:

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

Пример

Нека променим съдържанието на нашия параграф на текст с тагове:

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

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

HTML кодът ще изглежда така:

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

Пример

Нека на всеки параграф добавим в края неговия пореден номер в набора:

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

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

HTML кодът ще изглежда така:

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

Вижте също