## Tâche
Vous avez une liste de courses dans votre HTML, et vous devez sélectionner des éléments spécifiques en utilisant diverses méthodes de requête DOM.
1. **Sélection par ID** : Sélectionnez l'élément `<h1>` avec l'ID `title`;
2. **Sélection par Classe** : Sélectionnez tous les éléments avec la classe `item`;
3. **Sélection par Balise** : Sélectionnez tous les éléments `<li>`;
4. **Sélection du Premier Élément Correspondant** : Sélectionnez le premier élément `<li>` avec la classe `item`;
5. **Sélection de Tous les Éléments Correspondants** : Sélectionnez tous les éléments `<li>` avec la classe `item`.

PCFET0NUWVBFIGh0bWw+CjxodG1sPgogIDxoZWFkPgogICAgPGxpbmsgcmVsPSJzdHlsZXNoZWV0IiBocmVmPSJpbmRleC5jc3MiIC8+CiAgPC9oZWFkPgogIDxib2R5PgogICAgPGgxIGlkPSJ0aXRsZSI+U2hvcHBpbmcgTGlzdDwvaDE+CiAgICA8dWw+CiAgICAgIDxsaSBjbGFzcz0iaXRlbSI+TWlsazwvbGk+CiAgICAgIDxsaSBjbGFzcz0iaXRlbSI+RWdnczwvbGk+CiAgICAgIDxsaSBjbGFzcz0iaXRlbSI+QnJlYWQ8L2xpPgogICAgICA8bGkgY2xhc3M9Iml0ZW0iPkJ1dHRlcjwvbGk+CiAgICA8L3VsPgogICAgPCEtLSBEaXNwbGF5IFJlc3VsdHMgLS0+CiAgICA8ZGl2PgogICAgICA8cCBpZD0ic2VsZWN0ZWQtdGl0bGUiPjwvcD4KICAgICAgPHAgaWQ9InNlbGVjdGVkLWl0ZW1zLWNvdW50Ij48L3A+CiAgICAgIDxwIGlkPSJmaXJzdC1saS10YWciPjwvcD4KICAgICAgPHAgaWQ9ImZpcnN0LWl0ZW0iPjwvcD4KICAgICAgPHAgaWQ9ImFsbC1pdGVtcy1jb3VudCI+PC9wPgogICAgPC9kaXY+CiAgICA8c2NyaXB0IHNyYz0iaW5kZXguanMiPjwvc2NyaXB0PgogIDwvYm9keT4KPC9odG1sPg==

Ym9keSB7CiAgZm9udC1mYW1pbHk6ICdTZWdvZSBVSScsIFRhaG9tYSwgR2VuZXZhLCBWZXJkYW5hLCBzYW5zLXNlcmlmOwogIGJhY2tncm91bmQtY29sb3I6ICNmNGY2Zjk7CiAgbWFyZ2luOiAwOwogIGRpc3BsYXk6IGZsZXg7CiAgZmxleC1kaXJlY3Rpb246IGNvbHVtbjsKICBhbGlnbi1pdGVtczogY2VudGVyOwogIGp1c3RpZnktY29udGVudDogY2VudGVyOwogIGNvbG9yOiAjMzMzOwp9CgojdGl0bGUgewogIGZvbnQtc2l6ZTogMi41cmVtOwogIGNvbG9yOiAjM2E4YmNkOwogIHRleHQtdHJhbnNmb3JtOiB1cHBlcmNhc2U7CiAgbWFyZ2luLWJvdHRvbTogMXJlbTsKICBsZXR0ZXItc3BhY2luZzogMS4ycHg7Cn0KCnVsIHsKICBsaXN0LXN0eWxlLXR5cGU6IG5vbmU7CiAgcGFkZGluZzogMDsKICBtYXJnaW46IDAgMCAycmVtIDA7CiAgd2lkdGg6IDMyMHB4OwogIGJhY2tncm91bmQtY29sb3I6ICNmZmZmZmY7CiAgYm94LXNoYWRvdzogMCA0cHggMTBweCByZ2JhKDAsIDAsIDAsIDAuMSk7CiAgYm9yZGVyLXJhZGl1czogOHB4OwogIG92ZXJmbG93OiBoaWRkZW47Cn0KCi5pdGVtIHsKICBwYWRkaW5nOiAxNnB4OwogIGZvbnQtc2l6ZTogMS4xcmVtOwogIGJvcmRlci1ib3R0b206IDFweCBzb2xpZCAjZTBlNGU3OwogIHRyYW5zaXRpb246IGJhY2tncm91bmQtY29sb3IgMC4zcyBlYXNlLCBjb2xvciAwLjNzIGVhc2U7Cn0KCi5pdGVtOmxhc3QtY2hpbGQgewogIGJvcmRlci1ib3R0b206IG5vbmU7Cn0KCi5pdGVtOmhvdmVyIHsKICBiYWNrZ3JvdW5kLWNvbG9yOiAjZDNlOWY1OwogIGNvbG9yOiAjMjY3ZWJkOwogIGN1cnNvcjogcG9pbnRlcjsKfQoKZGl2IHsKICBiYWNrZ3JvdW5kLWNvbG9yOiAjZmZmZmZmOwogIHBhZGRpbmc6IDE2cHg7CiAgd2lkdGg6IDMyMHB4OwogIGJvcmRlci1yYWRpdXM6IDhweDsKICBib3gtc2hhZG93OiAwIDRweCAxMHB4IHJnYmEoMCwgMCwgMCwgMC4xKTsKICB0ZXh0LWFsaWduOiBsZWZ0Owp9Cgojc2VsZWN0ZWQtdGl0bGUsCiNzZWxlY3RlZC1pdGVtcy1jb3VudCwKI2ZpcnN0LWxpLXRhZywKI2ZpcnN0LWl0ZW0sCiNhbGwtaXRlbXMtY291bnQgewogIGZvbnQtc2l6ZTogMXJlbTsKICBtYXJnaW46IDhweCAwOwp9Cgojc2VsZWN0ZWQtdGl0bGUgewogIGZvbnQtd2VpZ2h0OiBib2xkOwogIGNvbG9yOiAjMjhhNzQ1Owp9Cgojc2VsZWN0ZWQtaXRlbXMtY291bnQgewogIGNvbG9yOiAjMTdhMmI4Owp9CgojZmlyc3QtbGktdGFnIHsKICBjb2xvcjogI2ZmYzEwNzsKfQoKI2ZpcnN0LWl0ZW0gewogIGNvbG9yOiAjZGMzNTQ1Owp9CgojYWxsLWl0ZW1zLWNvdW50IHsKICBjb2xvcjogIzZjNzU3ZDsKfQ==

Ly8gU2VsZWN0IGJ5IElECmNvbnN0IHRpdGxlRWwgPSBkb2N1bWVudC5fX19fXyhfX19fXyk7CmRvY3VtZW50LmdldEVsZW1lbnRCeUlkKAogICdzZWxlY3RlZC10aXRsZScKKS50ZXh0Q29udGVudCA9IGBTZWxlY3RlZCB0aXRsZTogJHt0aXRsZUVsLnRleHRDb250ZW50fWA7CgovLyBTZWxlY3QgYnkgQ2xhc3MKY29uc3QgaXRlbUVscyA9IGRvY3VtZW50Ll9fX19fKF9fX19fKTsKZG9jdW1lbnQuZ2V0RWxlbWVudEJ5SWQoCiAgJ3NlbGVjdGVkLWl0ZW1zLWNvdW50JwopLnRleHRDb250ZW50ID0gYE51bWJlciBvZiBpdGVtcyB3aXRoIGNsYXNzICdpdGVtJzogJHtpdGVtRWxzLmxlbmd0aH1gOwoKLy8gU2VsZWN0IGJ5IFRhZwpjb25zdCBsaUVscyA9IGRvY3VtZW50Ll9fX19fKF9fX19fKTsKZG9jdW1lbnQuZ2V0RWxlbWVudEJ5SWQoCiAgJ2ZpcnN0LWxpLXRhZycKKS50ZXh0Q29udGVudCA9IGBGaXJzdCB0YWcgbmFtZTogJHtsaUVsc1swXS50YWdOYW1lfWA7CgovLyBTZWxlY3QgdGhlIGZpcnN0IGl0ZW0KY29uc3QgZmlyc3RJdGVtRWwgPSBkb2N1bWVudC5fX19fXyhfX19fXyk7CmRvY3VtZW50LmdldEVsZW1lbnRCeUlkKAogICdmaXJzdC1pdGVtJwopLnRleHRDb250ZW50ID0gYEZpcnN0IGl0ZW0gdGV4dDogJHtmaXJzdEl0ZW1FbC50ZXh0Q29udGVudH1gOwoKLy8gU2VsZWN0IGFsbCBpdGVtcwpjb25zdCBhbGxJdGVtcyA9IGRvY3VtZW50Ll9fX19fKF9fX19fKTsKZG9jdW1lbnQuZ2V0RWxlbWVudEJ5SWQoCiAgJ2FsbC1pdGVtcy1jb3VudCcKKS50ZXh0Q29udGVudCA9IGBUb3RhbCBpdGVtcyBzZWxlY3RlZCB3aXRoIHF1ZXJ5U2VsZWN0b3JBbGw6ICR7YWxsSXRlbXMubGVuZ3RofWA7

- Utilisez `getElementById` pour sélectionner l'élément `<h1>` avec l'ID `title`;
- Utilisez `getElementsByClassName` pour sélectionner tous les éléments avec la classe `item`;
- Utilisez `getElementsByTagName` pour sélectionner tous les éléments `<li>`;
- Utilisez `querySelector` pour sélectionner le premier élément `<li>` avec la classe `item`;
- Utilisez `querySelectorAll` pour sélectionner tous les éléments `<li>` avec la classe `item`.

Ly8gU2VsZWN0IGJ5IElECmNvbnN0IHRpdGxlRWwgPSBkb2N1bWVudC5nZXRFbGVtZW50QnlJZCgndGl0bGUnKTsKZG9jdW1lbnQuZ2V0RWxlbWVudEJ5SWQoCiAgJ3NlbGVjdGVkLXRpdGxlJwopLnRleHRDb250ZW50ID0gYFNlbGVjdGVkIHRpdGxlOiAke3RpdGxlRWwudGV4dENvbnRlbnR9YDsKCi8vIFNlbGVjdCBieSBDbGFzcwpjb25zdCBpdGVtRWxzID0gZG9jdW1lbnQuZ2V0RWxlbWVudHNCeUNsYXNzTmFtZSgnaXRlbScpOwpkb2N1bWVudC5nZXRFbGVtZW50QnlJZCgKICAnc2VsZWN0ZWQtaXRlbXMtY291bnQnCikudGV4dENvbnRlbnQgPSBgTnVtYmVyIG9mIGl0ZW1zIHdpdGggY2xhc3MgJ2l0ZW0nOiAke2l0ZW1FbHMubGVuZ3RofWA7CgovLyBTZWxlY3QgYnkgVGFnCmNvbnN0IGxpRWxzID0gZG9jdW1lbnQuZ2V0RWxlbWVudHNCeVRhZ05hbWUoJ2xpJyk7CmRvY3VtZW50LmdldEVsZW1lbnRCeUlkKAogICdmaXJzdC1saS10YWcnCikudGV4dENvbnRlbnQgPSBgRmlyc3QgdGFnIG5hbWU6ICR7bGlFbHNbMF0udGFnTmFtZX1gOwoKLy8gU2VsZWN0IHRoZSBmaXJzdCBpdGVtCmNvbnN0IGZpcnN0SXRlbUVsID0gZG9jdW1lbnQucXVlcnlTZWxlY3RvcignLml0ZW0nKTsKZG9jdW1lbnQuZ2V0RWxlbWVudEJ5SWQoCiAgJ2ZpcnN0LWl0ZW0nCikudGV4dENvbnRlbnQgPSBgRmlyc3QgaXRlbSB0ZXh0OiAke2ZpcnN0SXRlbUVsLnRleHRDb250ZW50fWA7CgovLyBTZWxlY3QgYWxsIGl0ZW1zCmNvbnN0IGFsbEl0ZW1zID0gZG9jdW1lbnQucXVlcnlTZWxlY3RvckFsbCgnLml0ZW0nKTsKZG9jdW1lbnQuZ2V0RWxlbWVudEJ5SWQoCiAgJ2FsbC1pdGVtcy1jb3VudCcKKS50ZXh0Q29udGVudCA9IGBUb3RhbCBpdGVtcyBzZWxlY3RlZCB3aXRoIHF1ZXJ5U2VsZWN0b3JBbGw6ICR7YWxsSXRlbXMubGVuZ3RofWA7

Ce cours offre une exploration approfondie des principes clés de JavaScript, en se concentrant sur les classes, la manipulation du DOM, la gestion des événements et la programmation asynchrone. Vous apprendrez à créer des éléments dynamiques et interactifs, à gérer les interactions utilisateur et à traiter les opérations asynchrones. Grâce à un mélange de théorie et de défis pratiques, ce cours vous aide à développer des compétences pratiques en JavaScript pour des applications du monde réel.

Apprenez les fondamentaux des classes JavaScript, des déclarations de classes à la définition de méthodes qui améliorent la fonctionnalité. Découvrez comment utiliser efficacement les objets de paramètres, gérer les propriétés privées et contrôler l'accès avec les accesseurs et les mutateurs. Maîtrisez les propriétés statiques et les méthodes statiques et libérez la puissance de l'héritage de classe en utilisant "extends" et "super()" pour construire un code évolutif et réutilisable.

Maîtrisez la manipulation du DOM pour créer des applications web dynamiques et interactives. Naviguez et modifiez la structure du DOM, mettez à jour le contenu de manière dynamique et appliquez les meilleures pratiques en matière de sécurité et de performance. Différenciez les propriétés et les attributs pour optimiser votre code.

Débloquez l'interactivité de vos applications web en maîtrisant les événements JavaScript. Comprenez la propagation des événements, contrôlez le comportement des événements et implémentez une gestion efficace des événements pour les interactions utilisateur. Optimisez les performances avec des techniques avancées comme la délégation d'événements.

Cette section couvre les éléments essentiels de JavaScript asynchrone, y compris les callbacks, les Promesses et async/await. Vous apprendrez à récupérer des données à partir d'APIs, à intégrer des bibliothèques tierces et à gérer efficacement plusieurs requêtes, développant des compétences pour créer des applications axées sur les données.

Défi : Interroger le DOM

Tâche

Défi : Interroger le DOM

Tâche