L3 MIASHS, Programmation Web 2, année 2022
Quelques ressources en lignes
- Le site des tutoriels du W3C est une référence pour les langages du WEB (langue anglaise).
- Pour les non-anglophones le site de mozilla possède de nombreuses ressources en français pour HTML5, CSS3 et JavaScript
- Le site openclassrooms permet également de réviser les bases HTML5 et CSS3.
Le sujet du jour: les boucles
Indiquez quelle source vous avez utilisé et ajouté l’un des exemples
à TD3.html
.
Une première boucle
Essayez de reproduire l’exemple suivant dans TD3.html
en
utilisant un nouveau fichier de script TD3_script3.js
.
Une boucle un peu plus compliquée
Le HSL
est un format de couleur permettant de jouer sur
la tonalité et la saturation d’une teinte de couleur donné.
Essayez de reproduire le visualisateur de couleurs suivant dans un
script TD3_script4.js
en imbriquant deux boucles
for
et un l’évènement oninput
sur l’élément
input
.
Faites en sorte qu’en cliquant sur une couleur, cela déclenche un
alert
qui donne le code de la couleur.
Les tableau (Array) et les collections
Un tableau est un type de donnée (Array
) qui permet de
stocker une séquence d’éléments. C’est très proche d’une
liste
en python mais l’interface varie.
Vous pouvez trouver des détails ici à leur sujet.
- Écrire une boucle qui construit un tableau
A
contenant les 400 premiers entiers. - Extraire un tableau
B
contenant tous les éléments divisible 21. - Donnez la propriété qui donne la longueur de
B
- construire le tableau qui contient le carré de chaque élément entre 0 et 400.
- Que fait la fonction suivante:
function build_object(index){
let Obj = Object();
.x = index % 20;
Obj.y = (index - Obj.x)/20;
Objreturn Obj;
}
- Que retourne l’instruction suivante:
= A.map(build_object); C
- Réaliser à l’aide de l’instruction
forEach
et en utilisant des évènement et des styles bien choisit les éléments suivants.
Pour les animations, vous pouvez vous regarder la documentation sur les transitions CSS et en particulier, cette exemple.
Compiled the: mer. 04 sept. 2024 12:49:57 CEST