Работа с текстовым содержимым элемента
.text()
Возвращает или изменяет текстовое содержимое выбранных элементов страницы. Функция имеет три варианта использования:
.text():string1.0
возвращает текст содержащийся в выбранном элементе. Если таких элементов несколько, метод возвратит строку, в которой будет содержимое всех элементов, расположенное через пробел.
.text(newText):jQuery1.0
заменяет все содержимое у выбранных элементов, на текст newText.
.text(function(index, value)):jQuery1.4
заменяет все содержимое у выбранных элементов на возвращенный пользовательской функцией текст. Функция вызывается отдельно, для каждого из выбранных элементов. При вызове ей передаются следующие параметры: index — позиция элемента в наборе, value — текущий текст элемента.
Замечание: если вы попытаетесь с помощью метода text() поместить в элемент другие элементы с помощью html-текста, то jQuery будет экранировать все теги, и в результате на странице появится html-текст, вместо html-элементов (см. результат в разделе "В действии"). Для вставки html-элементов нужно использовать метод .html().
Примеры использования:
$(".topBlock").text() | вернет текстовое содержимое всех элементов с классом topBlock (одной строкой). |
$(".topBlock").text("Новье!") | заменит содержимое всех элементов с классом topBlock на текст "Новье!". |
В действии
поместим в элемент с классом demo-container текст:
~lt~!DOCTYPE html~gt~ ~lt~html~gt~ ~lt~head~gt~ ~lt~script src="https://code.jquery.com/jquery-latest.js"~gt~~lt~/script~gt~ ~lt~/head~gt~ ~lt~body~gt~ ~lt~div class="demo-container"~gt~ ~lt~div class="demo-box"~gt~Контейнер для демонстраций~lt~/div~gt~ ~lt~ul~gt~ ~lt~li~gt~Первый~lt~/li~gt~ ~lt~li~gt~Второй~lt~/li~gt~ ~lt~/ul~gt~ ~lt~/div~gt~ ~lt~script~gt~ $('div.demo-container').text('~lt~p~gt~ А вот и текст! ~lt~/p~gt~'); ~lt~/script~gt~ ~lt~/body~gt~ ~lt~/html~gt~