Beatriz tem um site com diversos elementos do tipo div, onde foi utilizada uma classe CSS com o nome "opcional", e deseja que eles fiquem ocultos quando forem clicados. Para adicionar a funcionalidade em todos os elementos via JavaScript, ela desenvolveu a função apresentada a seguir.const associar = (elementos) => {for(let obj of elementos)obj.addEventListener('click',(e)=>{e.target.style.display='none'});}Para executar a função criada, associando corretamente aos elementos do tipo div, Beatriz deve utilizar para o parâmetro elementos a expressão:
Comentário gerado por IA. É um apoio ao estudo, ancorado em fontes, mas pode conter imprecisões — confira sempre na fonte oficial (lei, súmula, edital e gabarito da banca). Encontrou um erro? Use “Reportar”.
Selecionando elementos no DOM - Métodos de acesso
Gabarito: letra B. A função associar espera uma coleção de elementos para iterar e adicionar o evento de clique. O método correto para obter todos os elementos com uma determinada classe CSS é document.getElementsByClassName("opcional") - ele retorna um HTMLCollection vivo que a função percorre com for...of. As demais alternativas usam métodos inexistentes ou com sintaxe inadequada.
A questão testa o conhecimento dos métodos nativos do DOM para selecionar elementos. A tabela abaixo resume os principais:
Método
Retorno
Uso correto
Existente?
getElementsByTagName
HTMLCollection
document.getElementsByTagName("div")
Sim
getElementsByClassName
HTMLCollection
document.getElementsByClassName("opcional")
Sim
getElementsByName
NodeList
document.getElementsByName("nome") - só para atributo name
Sim
getElementsByClass
-
Não existe
Não
getElementsById
-
Não existe (o correto é getElementById)
Não
Métodos de seleção DOM: getElementsByTagName (Parâmetro: nome da tag, Retorno: HTMLCollection); getElementsByClassName (Parâmetro: nome da classe, Retorno: HTMLCollection, Correto para o caso); getElementsByName (Parâmetro: atributo name, Retorno: NodeList); getElementsByClass (Não existe); getElementsById (Não existe (correto: getElementById))
Alternativa A — ❌ Incorreta
document.getElementsByTagName("div.opcional") está incorreto porque getElementsByTagName aceita apenas o nome da tag (ex.: "div"), não um seletor CSS. Para selecionar por tag e classe juntos, seria necessário usar document.querySelectorAll("div.opcional"). O parâmetro "div.opcional" é tratado literalmente como nome de tag, não encontrando nada.
Alternativa B — ✅ Correta ⟵ GABARITO
document.getElementsByClassName("opcional") retorna um HTMLCollection com todos os elementos que possuem a classe "opcional". Como o enunciado afirma que "diversos elementos do tipo div" usam essa classe, essa chamada captura exatamente os elementos desejados. O for...of da função associar itera perfeitamente sobre esse HTMLCollection.
Alternativa C — ❌ Incorreta
document.getElementsByName("div:opcional") invoca getElementsByName, que busca pelo atributo name dos elementos, não por classe ou seletor. Além disso, o argumento "div:opcional" não é um nome de atributo válido para essa finalidade. Esse método raramente é usado e não atende ao requisito.
Alternativa D — ❌ Incorreta
document.getElementsByClass("opcional") - esse método não existe na API DOM. O nome correto é getElementsByClassName (plural). É uma pegadinha clássica: a banca utiliza um nome parecido, mas sem o "Name" no final.
Alternativa E — ❌ Incorreta
document.getElementsById("div.opcional") - também não existe. O método correto para buscar por ID é document.getElementById("id") (singular), que retorna um único elemento, não uma coleção. Além disso, IDs são únicos, não se aplicam a múltiplos elementos.
NÃO CAIA NESSA!
A banca explora a confusão entre os nomes dos métodos: getElementsByClassName (classe) x getElementsByClass (inexistente) x getElementById (singular). Decore: para classes use "ClassName" (plural), para ID use "Id" (singular), para tag use "TagName", e para name use "Name". O seletor universal querySelectorAll também aceita CSS, mas não estava nas opções.