Solucionado (ver solução)
Solucionado
(ver solução)
2
respostas

[Dúvida] Dúvida sobre o querySelector

na aula mostou como importar do html pro js, mas fiquei em dúvida de como posso ser mais expecifico, por exemplo

//html
 <p class="texto__paragrafo"></p>
//js
let paragrafo = document.querySelector('p');
paragrafo.innerHTML = 'Escolha um número de 1 a 10';

se eu tiver outros < p > o js iria editar todos ?

2 respostas
solução!

Olá, Jean! Tudo bem?

A função querySelector é utilizada para selecionar um elemento específico no HTML. No exemplo que você deu, ao utilizar document.querySelector('p'), o JavaScript irá selecionar o primeiro elemento <p> que ele encontrar no HTML.

Se você tiver outros elementos <p> no seu HTML, o JavaScript irá editar apenas o primeiro que encontrar. Para ser mais específico e selecionar um elemento em particular, você pode utilizar uma classe ou um ID para identificar o elemento que deseja editar.

Por exemplo, se você adicionar uma classe ao seu parágrafo, assim:

<p class="texto__paragrafo"></p>

Você pode utilizar a função querySelector com a classe para selecionar apenas o parágrafo desejado:

let paragrafo = document.querySelector('.texto__paragrafo');
paragrafo.innerHTML = 'Escolha um número de 1 a 10';

Dessa forma, somente o parágrafo com a classe "texto__paragrafo" será editado.

Espero ter ajudado! Bons estudos!

o JavaScript seleciona o primeiro elemento "p" encontrado no HTML e define o conteúdo desse elemento como "Escolha um número de 1 a 10". Isso ocorre porque document.querySelector('p') seleciona o primeiro elemento "p"que corresponde ao seletor CSS 'p'. Se você tiver outros elementos "p" no seu HTML, eles não serão afetados por esse código.

se voce quiser ser mais especifico, selecione a class ao invés do "p" em si

<p class="texto__paragrafo">Este é o parágrafo específico</p>
<p>Este é outro parágrafo</p>
let paragrafoEspecifico = document.querySelector('.texto__paragrafo');
paragrafoEspecifico.innerHTML = 'Escolha um número de 1 a 10';