Implementação da Funcionalidade de Filtragem
Objetivo
Por fim, o último passo é adicionar a funcionalidade de filtragem dos artigos por tópico, que será implementada utilizando JavaScript.
Possível Prompt
É possível implementar o recurso de filtragem de artigos por tópico utilizando botões HTML e JavaScript?
Resultado
Arquivo index.html
- Inclusão de um bloco
navnoheaderpara posicionamento dos botões de filtragem; - Atribuição do atributo
data-categorya cada artigo, com o valor correspondente ao tópico; - Inclusão do link para o arquivo
index.jsantes da tag de fechamento dobody.
Arquivo index.css
Adição de estilos para aprimorar a aparência dos botões de filtragem.
Arquivo index.js
Inserção do script responsável pela lógica de filtragem.
Todas essas etapas foram orientadas pelo ChatGPT. Seguimos suas instruções.
index.html
index.css
index.js
Estado do site
Tutorial em Vídeo
Aqui está. Você conseguiu. Este é o seu site completo e totalmente funcional. Excelente trabalho!
Obrigado pelo seu feedback!
Pergunte à IA
Pergunte à IA
Pergunte o que quiser ou experimente uma das perguntas sugeridas para iniciar nosso bate-papo
Can you explain how the filtering functionality works in more detail?
What should I do if the filter buttons are not working as expected?
Can I add more categories or customize the filter buttons?
Awesome!
Completion rate improved to 5
Implementação da Funcionalidade de Filtragem
Deslize para mostrar o menu
Objetivo
Por fim, o último passo é adicionar a funcionalidade de filtragem dos artigos por tópico, que será implementada utilizando JavaScript.
Possível Prompt
É possível implementar o recurso de filtragem de artigos por tópico utilizando botões HTML e JavaScript?
Resultado
Arquivo index.html
- Inclusão de um bloco
navnoheaderpara posicionamento dos botões de filtragem; - Atribuição do atributo
data-categorya cada artigo, com o valor correspondente ao tópico; - Inclusão do link para o arquivo
index.jsantes da tag de fechamento dobody.
Arquivo index.css
Adição de estilos para aprimorar a aparência dos botões de filtragem.
Arquivo index.js
Inserção do script responsável pela lógica de filtragem.
Todas essas etapas foram orientadas pelo ChatGPT. Seguimos suas instruções.
index.html
index.css
index.js
Estado do site
Tutorial em Vídeo
Aqui está. Você conseguiu. Este é o seu site completo e totalmente funcional. Excelente trabalho!
Obrigado pelo seu feedback!