Olá galera, tive dificuldade em compreender este assunto. Realizei comentarios em cada linha de script. Só não entendi pq neste exercicio usamos a tag SPAN, qual a função dela neste script.
<body>
<input class="frase"><button class="botao">Copiar</button><span class="copia"></span>
<script>
var inputFrase = document.querySelector('.frase');
/*Seleciona as informações no HTML da CLASS"frase", neste caso o INPUT*/
var botao = document.querySelector('.botao');
/*Seleciona as informações no HTML da CLASS"botao", neste caso o BUTTON*/
var copia = document.querySelector('.copia');
/*Seleciona as informações no HTML da CLASS"frase", neste caso SPAN*/
function botaoHandler() {
/*Função para capturar as informações do INPUT e inserir no SPAN*/
copia.textContent = inputFrase.value;
/*Nesta linha, capturando os 'value'(valores) inseridos no INPUT e transformamos para o js 'textContent' que será salvo na SPAN*/
inputFrase.value = '';
}
botao.addEventListener('click', botaoHandler);
/*Insere um evento de escuta na var 'botao', a cada evento 'click' realizando o evento da função 'botaoHandler' */
</script>
</body>
