Lição 5 de 13 do curso Métodos DOM do JavaScript da Coddy.
A função getElementsByClassName() retorna um array de todos os elementos com um atributo de classe correspondente, útil para selecionar múltiplos elementos que compartilham o mesmo estilo ou comportamento. Por exemplo:
const elements = document.getElementsByClassName("className");
O código acima recupera os elementos com a classe className e os salva em uma variável chamada elements.
Temos que iterar sobre esta variável para alterar as propriedades de todos os elementos semelhantes, por exemplo:
for (const element of elements) {
className.style.color = "blue";
className.style.fontWeight = "bolder";
}
Desafio
Fácil
Você recebeu um código HTML que contém parágrafos com o nome de classe highlight.
Usando apenas JavaScript, altere a cor e o peso da fonte do texto:
Recupere os elementos usando a função getElementsByClassName().
Itere sobre essa variável de elementos recuperados usando um loop for.
Modifique a color para “orange” e o fontWeight para “bold” usando a propriedade style, para cada elemento no array.
Você precisará atualizar a página da web para ver as alterações: