From 06def397e18e9d65110725a7b4e7f9ce12d2243c Mon Sep 17 00:00:00 2001
From: Safaa Mahdir <safaa.mahdir@imt-atlantique.net>
Date: Wed, 26 Mar 2025 15:49:40 +0100
Subject: [PATCH] feat : ajouter le filtrage
---
script.js | 21 +++++++++++++++++++--
styles.css | 9 +++++++++
2 files changed, 28 insertions(+), 2 deletions(-)
diff --git a/script.js b/script.js
index 7c602e9..44ff9c5 100644
--- a/script.js
+++ b/script.js
@@ -16,6 +16,23 @@ function displayPokemonList() {
listElement.appendChild(listItem);
});
}
-
-// Afficher la liste au chargement de la page
document.addEventListener("DOMContentLoaded", displayPokemonList);
+
+function displayPokemons(list) {
+ const container = document.getElementById("pokemon-list");
+ container.innerHTML = "";
+ list.forEach(pokemon => {
+ const div = document.createElement("li");
+ div.textContent = `${pokemon.name} - ${pokemon.weight}kg - ${pokemon.height}m`;
+ container.appendChild(div);
+ });
+}
+
+// Filtrage
+document.getElementById("all").addEventListener("click", () => displayPokemons(pokemons));
+document.getElementById("weight").addEventListener("click", () => {
+ displayPokemons(pokemons.filter(p => p.weight > 3));
+});
+document.getElementById("height").addEventListener("click", () => {
+ displayPokemons(pokemons.filter(p => p.height < 1));
+});
\ No newline at end of file
diff --git a/styles.css b/styles.css
index bcd5606..35933c7 100644
--- a/styles.css
+++ b/styles.css
@@ -1,11 +1,20 @@
body {
font-family: Georgia, sans-serif;
+ text-align: center;
}
h1 {
color: darkcyan;
}
+button {
+ text-align: center;
+ background-color: #75a3a3;
+ border-color: #75a3a3;
+ color: white;
+ border-radius: 5px;
+}
+
ul {
list-style-type: none;
padding: 0;
--
GitLab