[Reclamação] conteúdo dos testes não corresponde ao das aulas

Olá Jimmena, como você está?

Peço desculpas pela demora em obter um retorno.

Entendo que pode ser frustrante encontrar atividades mais desafiadoras do que o conteúdo apresentado em aula, mas gostaria de encorajá-la a ver isso como uma oportunidade para aprimorar suas habilidades e conhecimentos. Desafios como estes são uma chance de desenvolver a sua criatividade, capacidade de resolução de problemas e pensamento crítico — habilidades essenciais em qualquer carreira de sucesso. No entanto, reconheço que poderíamos ter oferecido mais suporte e recursos para ajudá-la a se sentir mais preparada para esta atividade, sendo assim, explicarei passo a passo das funções utilizadas e o objetivo desta atividade.

O objetivo do código HTML criado por Wagner é permitir que o usuário digite uma frase em um campo de input e, ao clicar no botão "Copiar", essa frase seja exibida em uma tag span, que está logo após o botão. Além disso, após a cópia da frase, o conteúdo do input deve ser apagado.

Para alcançar esse objetivo, duas propriedades se fazem necessárias: value e textContent, que são usados para acessar e para modificar o conteúdo de um elemento HTML, mas para elementos diferentes. Enquanto, o value é utilizado para capturar elementos de entrada, ou seja, elementos onde o usuário insere dados, o textContent por sua vez é utilizado para acessar ou modificar o conteúdo de texto de um elemento.

Sendo assim, por o elemento input ser um elemento de entrada, ou seja, onde o usuário digita dados, iremos utilizar o atributo value para apagar o valor após o clique no botão copiar. E por o elemento span ser um elemento de texto, para modificá-lo iremos utilizar o atributo textContent. Porém, há uma ordem, primeiro devemos copiar a frase digitada e após isso, apagá-la do campo de digitação, portanto, o código correto da atividade é este apresentado abaixo:

function botaoHandler() {
        copia.textContent = inputFrase.value;
        inputFrase.value = '';
    }

Código completo com a função de copiar

<input class="frase"><button class="botao">Copiar</button><span class="copia"></span>
<script>
    var inputFrase = document.querySelector('.frase');
    var botao = document.querySelector('.botao');
    var copia = document.querySelector('.copia');

 function botaoHandler() {

        copia.textContent = inputFrase.value;
        inputFrase.value = '';
    }

    botao.addEventListener('click', botaoHandler);
 </script>

Caso queira testar o código completo, irá obter como resultado que ao escrever algo no campo de input e clicar em copiar, o texto do campo input é apagado deste campo e este mesmo texto aparece logo após o botão, como mostro no gif abaixo:

Por último, mas não menos importante, gostaria de ressaltar que o conteúdo deste curso foi atualizado para garantir que as informações sejam as mais atualizadas e relevantes possíveis. Te convido a conhecer o novo curso:

• JavaScript para Web: Crie páginas dinâmicas

Espero ter ajudado! Fico à disposição em caso de dúvidas.

Abraços e bons estudos!