Alterando o texto de um elemento com jQuery
Nas lições anteriores, aprendemos a obter
um grupo de elementos via jQuery e até vimos
alguns exemplos de como trabalhar com métodos. Agora
vamos analisá-los com mais detalhes. Nesta lição,
aprenderemos a alterar o texto de um elemento usando dois
métodos: html e
text.
Vamos resolver a seguinte tarefa: obter todos os elementos
com a classe www e simultaneamente alterar
o texto de todos para '!!!'. Suponha que temos
o seguinte código HTML:
<p class="www">text</p>
<p class="www">text</p>
<p class="www">text</p>
<p>text</p>
Então, o código JavaScript ficaria assim:
let elems = document.getElementsByClassName('www');
for (let i = 0; i < elems.length; i++) {
elems[i].innerHTML = '!!!';
}
Com jQuery será muito mais simples: obteremos
todos os elementos usando o cifrão, assim:
$('.www'), e depois aplicaremos a eles o método
html,
que aceita como parâmetro o novo
texto - $('.www').html('new text'). Pronto! Esta
linha fará todo o trabalho sem loops e
outras complicações. Execute o exemplo e veja
você mesmo:
$('.www').html('!!!');
Para todos os h3, usando o método html,
defina o texto como '!!!'.