Partage
  • Partager sur Facebook
  • Partager sur Twitter

Exercices interactifs pour le tutoriel de Javascript

Donnez votre avis

    21 février 2019 à 2:48:09

    Voici est une autre façon pour détecter le nombre décimal sans défaire votre script :

    if (parseFloat(userEntry) % 1 !== 0  || isNaN(number) || number < 0 || 999 < number) {

    au lieu de :

    if (isNaN(number) || number < 0 || 999 < number) {

    S. Tran

    • Partager sur Facebook
    • Partager sur Twitter
      6 mars 2019 à 12:43:15

      Bonjour, le chapitre sur Les événements, pour les exercices :

      Retirer un gestionnaire par clonage :

      var query = document.querySelector('#output button');
      var button2 = query.cloneNode(true);
      query.parentNode.appendChild(button2);
      query.parentNode.removeChild(query);

      Dans l’énoncé il n'est pas mentionné que le button porte l'id clickme.

      Utilisation du DOM-0 avec onclick :

      var button = document.querySelector('#output button');
      button.onclick = function() { 
      	button.innerHTML = 'Vous m\'avez cliqué';
      };

      Le dernier :

      http://odyssey.sdlm.be/javascript/47/partie2/chapitre3/list-and-prompt.htm

      var div = document.getElementById('output');
      div.addEventListener('click', function(e) {
      	e.target.innerHTML = prompt('Modifier le texte');
      });



      très bon cours avec pas mal d'exercices merci.

      Bertrand

      -
      Edité par Bazoonga 6 mars 2019 à 15:14:18

      • Partager sur Facebook
      • Partager sur Twitter
        14 mars 2019 à 16:10:06

        bonjour, 

        merci pour les exo interactifs !

        pour l'exo Supprimer tous les enfants d'un élément (partie 2 chap 2), j'ai testé de remplacer la div par une div vide avec le même id : 

        ça fonctionne sur le navigateur :

        mais on ne peut pas la tester dans l'exo :

        Blandine

        -
        Edité par BlandineHayot 14 mars 2019 à 16:10:36

        • Partager sur Facebook
        • Partager sur Twitter
          14 mai 2019 à 16:09:10

          Dans le cours "Dynamisez vos sites Web avec JavaScript", je trouve que les exercices donné à la fin des chapitres manque de cohérence. Ils sont donné sans contexte "pratique". Du coup, j'ai souvent du mal à les réussir car ils n'ont pour moi aucune logique. J'ai suivi d'autres tutoriel en ligne, où les mêmes notions ont été abordé dans un contexte où chaque exercice s'enchaînent pour amener à la réalisation de quelque chose de concret et cela me semblait plus clair.

          Le cours parle de dynamiser nos sites web mais les exercices ne sont pas utilisé dans ce contexte, c'est vraiment dommage. J'en suis au 11ème chapitre et aucun exemple donnés ne s'inscrit dans cette dynamique.

          De plus, le HTML est truffé de balise auto-fermante largement dépréciées (<hr />, <br />, ...).

          • Partager sur Facebook
          • Partager sur Twitter
            28 juin 2019 à 21:35:22

            A propos du Mini-TP n°1 : recréer une structure DOM, voici une autre solution possible 

            function run(){
                    let output = document.getElementById('output'),
                        divTp1 = document.createElement('div'),
            
                        elements= ['strong','a'],
            
                        texts = [
                            'Le ',
                            'World Wide Web Consortium',
                            ', abrégé par le sigle ',
                            'W3C',
                            ', est un ',
                            'Organisme de standardisation ',
                            'à but non-lucratif chargé de promouvoir la compatibilité des technologies du ',
                            'World Wide Web'
                        ];
                    divTp1.id ='divTP1';
            
                    for(let i = 0, j = elements.length; i<j; i++){
                        for (let k = 0, l = j ; k<l; k++){
            
                            let element = document.createElement(elements[i]);
                            divTp1.appendChild(element);
            
                        }
            
                    }
            
                    let children = divTp1.children;
            
                    //alert(children[0].nodeName);
            
                    //console.log(children);
                    let i = 0;
            
                    for(let  j = 2 ,k = (texts.length/2) - 1  ; j < k; j++){
            
                        for(let l = 0, m = children.length ; l < m; l++){
            
                            let text_before = document.createTextNode(texts[i]);
                            let text_child = document.createTextNode(texts[i+1]);
                            i +=2;
            
                            divTp1.insertBefore(text_before,children[l]);
                            children[l].appendChild(text_child);
            
                            if(children[l].nodeName.toLowerCase() === 'a'){
            
                                children[l].href = 'http://fr.wikipedia.org/wiki/'+text_child.textContent.replace(" ", "_");
                                children[l].title = text_child.data;
                            }
            
                        }
            
                    }
            
                    output.appendChild(divTp1);
            
                }
            Ainsi, on obtient le code html suivant: 
            <div id="divTP1">
            <div id="divTP1">
                Le <strong>World Wide Web Consortium</strong>, abrégé par le sigle <strong>W3C</strong>, est un 
                <a href="http://fr.wikipedia.org/wiki/Organisme_de_normalisation" title="Organisme de normalisation">
                    organisme de standardisation</a>
                à but non-lucratif chargé de promouvoir la compatibilité des technologies du 
                <a href="http://fr.wikipedia.org/wiki/World_Wide_Web" title="World Wide Web">World Wide Web</a>.
            </div>
            </div>
             



            • Partager sur Facebook
            • Partager sur Twitter

            Ksk

              30 juillet 2019 à 11:00:52

              Bug:

              Il  y a un souci, les réponses aux questions ouvertes s'affichent directement au chargement de la page

              Sinon merci beaucoup pour ce tutoriel très pédagogique :)

              • Partager sur Facebook
              • Partager sur Twitter

              Laurence

                31 juillet 2019 à 17:55:29

                Bonjour,

                Il doit y avoir une erreur de frappe dans la réponse de la dernière question du questionnaire à choix multiples du chapitre 6 de la partie 1:

                Oui, ça fonctionne. La portée d'une variable déclarée avec var est locale à la fonctionne, et non au bloc if/else. Mais c'est vraiment une mauvaise pratique : préférez déclarer vos variables avec var dès le début de la fonction.


                Cordialement

                Muriel

                • Partager sur Facebook
                • Partager sur Twitter
                  6 décembre 2019 à 8:55:16

                  Bonjour,

                  Dans le chapitre 2 exercice 1 je ne comprends pas pourquoi il y a un [0] pour modifier le href. 

                  var output = document.getElementById('output');var link = output.getElementsByTagName('a')[0]; link.href ='http://www.openclassrooms.com';
                  • Partager sur Facebook
                  • Partager sur Twitter
                    13 décembre 2019 à 16:01:04

                    Bonjour,

                    je suis actuellement le cours (très intense) sur Javascript. Merci pour tout ce travail ! :)

                    Je réagis aux exercices de la partie "les événements" :

                    J'ai saisi ce code en résolution à l'exercice et ça ne fonctionne pas

                    var button = document.getElementsByTagName("button")[0];
                    button.onclick = function() {
                    	this.innerHTML = "Vous m'avez cliqué";
                    }

                    Quand je regarde la solution, il y a des "if" partout mais leur présence n'est pas expliqué, alors qu'ils n'ont pas été mis dans les cours.

                    la solution donnée :

                    var output, button;
                    
                    if (output = document.getElementById("output")) {
                        if (button = output.getElementsByTagName("button")) {
                            button.onclick = function() {
                                this.innerHTML = "Vous m'avez cliqué";
                           };
                        }
                    }


                    J'aimerai donc comprendre pourquoi mon code ne fonctionne pas, pourquoi il faut mettre des "if" ?
                    Merci !

                    Réponse à BaptisteL'H
                    "getElementsByTagName" renvoie la liste de toutes les balises "a" de la page, il faut donc indiquer entre crochet quelle balise tu veux cibler (si c'est la toute première ou s'il n'y en a qu'une seule dans la page, il faut mettre [0]).

                    -
                    Edité par Anya 13 décembre 2019 à 16:03:46

                    • Partager sur Facebook
                    • Partager sur Twitter
                      11 janvier 2020 à 14:16:25

                      Bonjour,

                      Super exercice, j'aime beaucoup !

                      Il me semble de la réponse correcte à cet exercice est className et pas class comme affiché ci-dessous :

                      • Partager sur Facebook
                      • Partager sur Twitter
                        Staff 11 janvier 2020 à 16:28:49

                        @CécileGallioz1 Bonjour, la question est négative "quel procédé ne faut-il pas utiliser?". Donc la réponse à la question est bien element.class puisque les deux autre réponses sont correct en JS. 

                        oui je sais cela peut êtres tordu....

                        • Partager sur Facebook
                        • Partager sur Twitter

                        Exercices interactifs pour le tutoriel de Javascript

                        × Après avoir cliqué sur "Répondre" vous serez invité à vous connecter pour que votre message soit publié.
                        • Editeur
                        • Markdown