Манипуляции с HTML
Получим все элементы с помощью доллара, $('.www')
, а потом применим к ним метод .html()
, который параметром принимает новый текст - $('.www').html('Новый текст')
. Одна строчка выполнит всю работу без всяких циклов и прочей ерунды:
<p class="www">Абзац.</p>
<p class="www">Абзац.</p>
<p class="www">Абзац.</p>
<p>Абзац.</p>
<script>
$('.www').html('!!!');
</script>
Можно не выстраивать цепочку $('.www').html('!!!')
, а сначала записать набор элементов $('.www')
в переменную, и затем уже к этой переменной применить метод .html('!!!')
:
<p class="www">Абзац.</p>
<p class="www">Абзац.</p>
<p class="www">Абзац.</p>
<p>Абзац.</p>
<script>
var elems = $('.www');
elems.html('!!!');
</script>
Есть соглашение, которым желательно пользоваться для удобства - названия переменных которые содержат в себе обернутый набор jQuery, принято начинать с доллара. То есть в нашем случае нужно писать $elems
.
<p class="www">Абзац.</p>
<p class="www">Абзац.</p>
<p class="www">Абзац.</p>
<p>Абзац.</p>
<script>
var $elems = $('.www');
$elems.html('!!!');
</script>
Метод .html()
можно использовать не только для изменения текста элементов, но и для вывода его на экран. Давайте получим элемент и выведем алертом его текст:
<p id="test">Абзац.</p>
alert($('#test').html());
Если вы попытаетесь получить текст всех элементов, увидите только содержимое первого элемента, для этих целей есть метод .each()
, чтобы получить тексты всех элементов.
Манипуляции с текстом
Получаем текстовое содержимое:
<div class="box">
<p>Абзац.</p>
<p>Абзац.</p>
<p>Абзац.</p>
</div>
<script>
$('.box').text();
</script>
Результат:
Абзац.
Абзац.
Абзац.