Implementering af Filtreringsfunktionalitet
Mål
Sidst men ikke mindst er det sidste trin at tilføje funktionalitet til filtrering af artikler efter emne, hvilket vil blive implementeret ved hjælp af JavaScript.
Mulig prompt
Kan du implementere funktionen til at filtrere artikler efter emne ved hjælp af HTML-knapper og JavaScript?
Resultat
index.html fil
- Vi tilføjer et
nav-blok tilheader, hvor vores filtreringsknapper vil blive placeret; - Vi giver hver artikel attributten
data-categoryog den tilsvarende emneværdi; - Vi tilføjer linket til
index.js-filen før den afsluttendebody-tag.
index.css fil
Vi tilføjer nogle stilarter for at få filtreringsknapperne til at se pæne ud.
index.js fil
Vi indsætter scriptet, der implementerer filtreringslogikken.
Alt dette har ChaGPT fortalt os at gøre. Vi fulgte dens instruktioner.
index.html
index.css
index.js
Website-tilstand
Videovejledning
Her er det. Du har klaret det. Dette er dit komplette, fuldt funktionelle website. Flot arbejde!
Tak for dine kommentarer!
Spørg AI
Spørg AI
Spørg om hvad som helst eller prøv et af de foreslåede spørgsmål for at starte vores chat
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 5Implementering af Filtreringsfunktionalitet
Stryg for at vise menuen
Mål
Sidst men ikke mindst er det sidste trin at tilføje funktionalitet til filtrering af artikler efter emne, hvilket vil blive implementeret ved hjælp af JavaScript.
Mulig prompt
Kan du implementere funktionen til at filtrere artikler efter emne ved hjælp af HTML-knapper og JavaScript?
Resultat
index.html fil
- Vi tilføjer et
nav-blok tilheader, hvor vores filtreringsknapper vil blive placeret; - Vi giver hver artikel attributten
data-categoryog den tilsvarende emneværdi; - Vi tilføjer linket til
index.js-filen før den afsluttendebody-tag.
index.css fil
Vi tilføjer nogle stilarter for at få filtreringsknapperne til at se pæne ud.
index.js fil
Vi indsætter scriptet, der implementerer filtreringslogikken.
Alt dette har ChaGPT fortalt os at gøre. Vi fulgte dens instruktioner.
index.html
index.css
index.js
Website-tilstand
Videovejledning
Her er det. Du har klaret det. Dette er dit komplette, fuldt funktionelle website. Flot arbejde!
Tak for dine kommentarer!
