Feat(1NSI): QCM pour Interaction WEB

1NSI/08_Interaction_web/QCM.tex

@@ -0,0 +1,19 @@
+\documentclass[a4paper,10pt]{article}
+\usepackage{myXsim}
+\usepackage{minted}
+
+\author{Benjamin Bertrand}
+\title{Interaction WEB - Exercices}
+\date{Mars 2023}
+
+\DeclareExerciseCollection[step=4]{banque}
+\xsimsetup{collect}
+
+\pagestyle{empty}
+
+\begin{document}
+\input{exercises.tex}
+
+\printcollection{banque}
+
+\end{document}

1NSI/08_Interaction_web/exercises.tex

@@ -142,3 +142,83 @@
     \end{enumerate}
 
 \end{exercise}
+
+
+\begin{exercise}[subtitle={QCM}, step={4}, origin={}, topics={ Interaction web }, tags={ Javascript, Web }]
+    \begin{enumerate}
+        \item Parmi les langages suivants, lequel est exécuté sur le serveur lors de la consultation d’une page Web ?
+            \begin{tasks}(4)
+                \task JavaScript
+                \task HTML
+                \task CSS
+                \task PHP
+            \end{tasks}
+
+        \item Dans une page HTML, lequel de ces codes permet la présence d'un bouton qui appelle la fonction javascript \mintinline{javascript}{afficher_reponse()} lorsque l'utilisateur clique dessus ?
+            \begin{tasks}(1)
+                \task \mintinline{html}{<a href="afficher_reponse()">Cliquez ici</a> }
+                \task \mintinline{html}{<button if_clicked="afficher_reponse()">Cliquez ici</button> }
+                \task \mintinline{html}{<button  value="Cliquez ici"><a> afficher_reponse()</a></button> }
+                \task \mintinline{html}{<button onclick="afficher_reponse()">Cliquez ici</button>}
+            \end{tasks}
+        \item On souhaite qu’un menu apparaisse à chaque fois que l’utilisateur passe sa souris sur l’image de bannière du site. L’attribut de la balise img dans lequel on doit mettre un code Javascript à cet effet est :
+            \begin{tasks}(4)
+                \task \mintinline{html}{onclick }
+                \task \mintinline{html}{src  }
+                \task \mintinline{html}{alt }
+                \task \mintinline{html}{onmouseover }
+            \end{tasks}
+        \item Une page HTML contient la ligne suivante dans laquelle un mot a été remplacé par des points de supsension :  \mintinline{html}{<p ...... ="alert('hello')"> Survolez-moi </p> }
+
+            Au survol de la souris, le message hello apparait dans une boite de dialogue.
+
+            Par quel mot faut-il remplacer les points de suspension ?
+            \begin{tasks}(4)
+                \task \mintinline{javascript}{onmouseout }
+                \task \mintinline{javascript}{onmouseover }
+                \task \mintinline{javascript}{onmouseleave }
+                \task \mintinline{javascript}{onclick}
+            \end{tasks}
+
+        \item \mintinline{javascript}{onmouseover} est une méthode qui permet de traiter un événement de quel type ?
+            \begin{tasks}(2)
+                \task l'appui d'une touche du clavier
+                \task un clic sur un bouton de souris
+                \task un mouvement de la souris
+                \task le survol par la souris d'un élément de la page
+            \end{tasks}
+
+        \item Parmi les propriétés suivantes d’une balise <button /> dans une page HTML, laquelle doit être rédigée en langage JavaScript ?
+
+            \begin{tasks}(4)
+                \task la propriété name
+                \task la propriété type
+                \task la propriété onclick
+                \task la propriété id
+            \end{tasks}
+
+        \item Un élève a écrit une fonction javascript qui détermine la moyenne des valeurs entrées par l'utilisateur dans un  formulaire de sa page HTML.
+
+            Il place sa fonction javascript :
+            \begin{tasks}(1)
+                \task entre la balise <js> et la balise </js>
+                \task entre la balise <code> et la balise </code>
+                \task entre la balise <script> et la balise </script>
+                \task entre la balise <javascript> et la balise </javascript>
+            \end{tasks}
+
+        \item Voici un extrait d'un document HTML.
+
+            \begin{minipage}{0.8\linewidth}
+                \inputminted[bgcolor=base3]{html}{./script/QCM_body.html}
+            \end{minipage}
+
+            Quelle doit être la ligne qui remplace les pointillés pour obtenir un bouton dont l'appui déclenche la fonction javascript \mintinline{javascript}{actionBouton()} ?
+            \begin{tasks}(2)
+                \task \mintinline{html}{<button click = "actionBouton();"> }
+                \task \mintinline{html}{<button onclick = "actionBouton();"> }
+                \task \mintinline{html}{<button onclick => "actionBouton();" }
+                \task \mintinline{html}{<button> onclick = "actionBouton();"}
+            \end{tasks}
+    \end{enumerate}
+\end{exercise}

1NSI/08_Interaction_web/script/QCM_body.html

@@ -0,0 +1,8 @@
+<html>
+<body>
+    .........
+    Clic !
+    </button>
+    <h1><span id="valeur">2000</span></h1>
+</body>
+</html>