diff --git a/cours_vanilla_js/index.html b/cours_vanilla_js/index.html
new file mode 100644
index 0000000..c30bf77
--- /dev/null
+++ b/cours_vanilla_js/index.html
@@ -0,0 +1,13 @@
+
+
+
+
+
+ Vanilla JS
+
+
+
+
+
+
+
\ No newline at end of file
diff --git a/cours_vanilla_js/live-server.png b/cours_vanilla_js/live-server.png
new file mode 100644
index 0000000..a2cbed8
Binary files /dev/null and b/cours_vanilla_js/live-server.png differ
diff --git a/cours_vanilla_js/script.js b/cours_vanilla_js/script.js
index e850094..5546eb2 100644
--- a/cours_vanilla_js/script.js
+++ b/cours_vanilla_js/script.js
@@ -69,15 +69,51 @@ console.log(listeetudiantes);
})
+// Object.hey permet de récupérer la liste des clefs (keys) de l'objet sous la forme d'un tableau
let listedeskey = Object.keys(listeetudiantes);
console.log(listedeskey);
+// ensuite on peu boucler sur le tableau des clefs (keys) avec foreach (foreach ne fonctionne pas sur les objets)
listedeskey.forEach(key => {
console.log(key);
- let ville = listeetudiantes[key]
+ // et on récupère les valeurs en utilisant la clef (key)
+ let ville = listeetudiantes[key];
console.log(ville);
+ // on refait une boucle imbriquée (une boucle dans une boucle)
ville.forEach(etudiant => {
console.log(etudiant.prenom);
-
})
});
+// recupère le body
+let body = document.body;
+
+// créer un element html virtuel
+let titre = document.createElement('h1');
+// on insert du text dans la balise
+titre.innerText = "salut ma div :)";
+// on ajoute une classe
+titre.classList.add('titre');
+// on insert l'element html dans la page
+body.append(titre);
+
+// on boucle pour créer x elements
+// a : la valeur de départ de l'index (i)
+// b : tant que b est vrai, la boucle continue
+// c : la valeur d'incrémentation de l'index (i)
+//
+// a b c
+// -------- ------ ---
+// | | | | | |
+for (let i = 0; i < 10; i++) {
+ let monrond = document.createElement('div');
+ monrond.classList.add('rond');
+ monrond.innerText = i;
+ // math.random renvoie un nombre entre 0 et 1 (ex 0.45)
+ monrond.style.top = Math.random()*window.innerHeight +"px";
+ monrond.style.left = Math.random()*window.innerWidth +"px";
+ body.append(monrond);
+}
+
+
+
+
diff --git a/cours_vanilla_js/style.css b/cours_vanilla_js/style.css
new file mode 100644
index 0000000..81511c9
--- /dev/null
+++ b/cours_vanilla_js/style.css
@@ -0,0 +1,15 @@
+h1.titre{
+ display: block;
+ border: red 1px solid;
+}
+
+div.rond{
+ /* display: inline-block; */
+ width: 20px;
+ height: 20px;
+ border-radius: 10px;
+ background-color: red;
+ /* top:50px;
+ left:78px; */
+ position: absolute;
+}
\ No newline at end of file