Selector CSS
Se trata de localizar el primer elemento de la página que tenga el valor de texto dentro del atributo class
El contenido de este bloque se debe copiar al primer párrafo de la página
Los cambios se harán al pulsar en un botón..
Solución
<script>
function copiar(){
let blq = document.querySelector(".texto");
let dst = document.querySelector("p");
dst.innerHTML = blq.innerHTML
}
function iniciar(){
let boton = document.querySelector("#copiar");
boton.addEventListener('click', copiar)
}
</script>
<body onload="iniciar()">
<div class="texto">
Contenido que se va a copiar al primer párrafo del documento
</div>
<div class="texto">
Este contenido no se va a copiar. Lo copiado parece aquí abajo.
</div>
<p></p>
<p><button id="copiar">Copiar</button></p>
</body>
Explicación
El evento onload de body nos asegura que todo está está ya cargado antes de ejecutar el script. También puedes poner el script al final de la sección body
En este ejemplos se usael método querySelector() para localizar elementos. Este método usa como argumento un selector similar a los que se usan al definir estilos por CSS, opr ejemplo: un .nombre_clase (punto segido de un nombre), almohadilla seguido del id (#id) o una etiqueta html (p, dov...).
En general este argumento admite todos los selectores usados en CSS, incluyento combinaciones 'p .code' se refiere al elemento con class code dentro del párrafo.
En todos los casos devuelve el primer elemento que responde a ese argumento.
En el ejemplo al poner querySelector(".texto") se selecciona el primer elemento con class="texto".
Mientras que document.querySelector("#copiar") devuelve el objeto correspondiente al bloque co id = "copiar", en este caso el botón. Aquí funciona como getElementById()
Y document.querySelector("p") nos devuelve el primer párrafo dentro de document.
El resto del script es simple al pulsar el botón se produce un evento onclick que invoca a la función copiar(). En esta función se obtiene el objeto bloq y su contenido (blq.innerHTML) se copia al contenido del primier párrafo (dst) asginándolo a dst.innerHTML
Si no te basta con el primer elemento y quieres usar selectores CSS para seleccionar todos los elementos que cumplan con el selector debes usar el método querySelectAll()