Implementering av Filtreringsfunktionalitet
Mål
Slutligen är det sista steget att lägga till funktionalitet för att filtrera artiklar efter ämne, vilket kommer att implementeras med JavaScript.
Möjlig uppgift
Kan du implementera funktionen att filtrera artiklar efter ämne med hjälp av HTML-knappar och JavaScript?
Resultat
index.html file
- Vi lägger till ett
nav-block iheaderdär våra filtreringsknappar placeras; - Vi förser varje artikel med attributet
data-categoryoch motsvarande ämnesvärde; - Vi lägger till länken till
index.js-filen före den avslutandebody-taggen.
index.css file
Vi lägger till några stilar för att göra filtreringsknapparna snygga.
index.js file
Vi klistrar in skriptet som implementerar filtreringslogiken.
Allt detta har ChaGPT instruerat oss att göra. Vi följde dess instruktioner.
index.html
index.css
index.js
Webbplatsens tillstånd
Videohandledning
Här har du det. Du klarade det. Detta är din kompletta, fullt fungerande webbplats. Bra jobbat!
Tack för dina kommentarer!
Fråga AI
Fråga AI
Fråga vad du vill eller prova någon av de föreslagna frågorna för att starta vårt samtal
Awesome!
Completion rate improved to 5
Implementering av Filtreringsfunktionalitet
Svep för att visa menyn
Mål
Slutligen är det sista steget att lägga till funktionalitet för att filtrera artiklar efter ämne, vilket kommer att implementeras med JavaScript.
Möjlig uppgift
Kan du implementera funktionen att filtrera artiklar efter ämne med hjälp av HTML-knappar och JavaScript?
Resultat
index.html file
- Vi lägger till ett
nav-block iheaderdär våra filtreringsknappar placeras; - Vi förser varje artikel med attributet
data-categoryoch motsvarande ämnesvärde; - Vi lägger till länken till
index.js-filen före den avslutandebody-taggen.
index.css file
Vi lägger till några stilar för att göra filtreringsknapparna snygga.
index.js file
Vi klistrar in skriptet som implementerar filtreringslogiken.
Allt detta har ChaGPT instruerat oss att göra. Vi följde dess instruktioner.
index.html
index.css
index.js
Webbplatsens tillstånd
Videohandledning
Här har du det. Du klarade det. Detta är din kompletta, fullt fungerande webbplats. Bra jobbat!
Tack för dina kommentarer!