wayground logo

Free Printable Worksheets

Font size

S
M
L
XL
Worksheets

Quiz HTML/CSS/JS

Total questions: 56

Worksheet time: 35mins

Name
Class
Date
1.

1. Dans quel balise HTML plaçons-nous le code JavaScript?

a)

La balise js

b)

La balise javascript

c)

La balise script

d)

La balise rel

2.

3. Quelle est la syntaxe correcte pour faire référence à un script externe appelé « myscript.js »?

a)

<script href="myscript.js">

b)

<script name="myscript.js">

c)

<script src="myscript.js">

d)

Tout les réponses sont vrais

3.

4. Le fichier externe de JavaScript doit contenir la balise <script>?

a)

Vrai

b)

Faux

4.

5. Quel est le bon endroit pour insérer un code JavaScript?

a)

La section <head>

b)

Les deux sections <head> et <body> sont correctes

c)

La section <body>

d)

Aucune de ces réponses n’est vraie.

5.

6. Comment écrivez-vous « Hello World » dans une boîte d’alerte?

a)

msg("Hello World");

b)

alert("Hello World");

c)

msgBox("Hello World");

d)

alertBox("Hello World");

6.

Quel est l'outil pour valider la structure de notre code HTML?

a)

W3C HTML Validator

b)

Visual Studio Code

c)

Le navigateur web avec un afficher la source

d)

La console du navigateur avec la touche FF11

7.

comment cible t'on un id en JavaScript?

a)

getElementsbyTagName()

b)

getElementsbyClassName()

c)

getElementbyId()

8.

Quelles propriétés permettent de changer le texte d'un élément HTML?

a)

innerText

b)

innerHTML

c)

textContent

d)

changeMyText

9.

En JavaScript, les noeuds de l’arbre DOM sont des objets de type

a)

variable

b)

fonction

c)

node

10.

Quelle type de donnée renvoie le getElementsbyClassName et getElementsByTagName?

a)

integer (entier)

b)

array (tableau)

c)

String (chaine de caractère)

11.

Les paragraphes de mon site prennent toutes la largeur de ma page pourquoi?

a)

Ils sont en display:block par défaut

b)

Ils sont en float:left par défaut

c)

Ils sont en float:inline par défaut

d)

Ils sont en flex:1; par défaut

12.

quelle méthode permet de supprimer le dernier item d'un tableau?

a)

array.pop()

b)

array.corn()

c)

array.loli()

d)

array.flakes()

13.

quelle méthode permet de rajouter un item la fin d'un tableau

a)

array.push()

b)

array.pull()

c)

array.marco()

d)

array.polo()

14.

quelle méthode permet de supprimer le 1er item d'un tableau?

a)

array.shift()

b)

array.unshift()

c)

array.popStart()

d)

array.split()

15.

quelle méthode permet de créer un écouteur événement ?

a)

ajouterunécouteurd'evenement()

b)

addEventListener()

c)

listentoMe()

d)

hein?

16.

L'opérateur de comparaison == sert à comparer...

a)

L'égalité en valeur simplement

b)

L'égalité en valeur et en type

c)

La différence en valeur simplement

17.

Dans une course à vélo, si je dépasse le second je deviens alors ?

a)

Premier

b)

Second

c)

Troisième

18.

Qu'est ce que l'hébergement web?

a)

C'est l'endroit où notre site se situe

b)

C'est la technologie de notre site

c)

C'est le nom de domaine du site

d)

C'est l'emplacement géographique de notre site

19.

Quelle est la meilleur manière de faire un menu de site web?

a)

<nav><ul><li><a>

b)

<menu><menuitem><a>

c)

<link><a>

d)

<ol><li><a>

20.

Pourquoi le head est une balise obligatoire?

a)

Il contient des infos essentielles pour le navigateur

b)

Il contient l'entête de mon site dont le menu

c)

Il permet d'afficher le contenu de mon site

d)

Il permet de charger le PHP de ma page

21.

Avec le code suivant, mon image ne s'affiche pas pourquoi?


<img src="equipe/Pelletire.png">

a)

Le chemin de l'image n'est pas le bon

b)

Le format de fichier PNG est invalide

c)

L'attribut alt n'est pas présent

d)

La balise img n'est pas fermée

22.

Je veux appliquer un style erreur à une div, quelle est la meilleure manière de faire?

a)

<div class="erreur">

b)

<div style="color:red;">

c)

<div id="erreur">

d)

<div css="erreur">

23.

Si je veux empêcher l'envoi de mon formulaire HTML en validant la présence d'une valeur dans un champs avec HTML:

a)

Utiliser l'attribut Value

b)

Utiliser l'attribut Required

c)

Utiliser la balise Label

d)

Utiliser la balise Input

24.

Quelle est la bonne syntaxe pour déclarer une variable en JavaScript?

a)

let age;

b)

VAR age;

c)

string age;

d)

const age;

25.

À quoi sert le DOM pour JavaScript?

a)

Il permet d'aller chercher n'importe quel élément d'une page Web

b)

Il permet d'afficher n'importe quel élément d'une page Web

c)

Il permet d'exécuter du javascript dans une page

d)

Il permet l'interactivité d'une page Web

26.

Si je veux déboguer efficacement une variable en Javascript je devrais utiliser la méthode:

a)

console.log();

b)

alert();

c)

var_dump()

d)

innerHTML()

27.

Quel standard suit JavaScript ?

(a)  

28.

Quelle fonctionnalité est présentée ici ?

a)

Spread operator

b)

Destructuration

c)

Decomposition

d)

Array Slicing

29.

Quel sera le résultat de 5+5-"8" ?

a)

558

b)

55

c)

108

d)

2

30.

Quel sera le résultat de 2+3+"5" ?

a)

55

b)

235

c)

10

d)

NaN

31.

Que permet le hoisting ?

a)

Il permet de ne plus déclarer ses variables

b)

Utiliser des fonctions/variables avant qu'elles soient déclarées

c)

Transformer les const/let en var

d)

Redéfinir des constantes

32.

Que retourne l'expression suivante ?

a)

true

b)

false

c)

null

d)

undefined

33.

la fonction listener est appelée lorsque l’événement

a)

se produit

b)

se termine

34.

Dans une fonction listener, la variable this est définie et désigne

a)

l’objet cible de l’événement

b)

le window

c)

le code HTML

35.

Qu’est-ce qui sera enregistré sur la console ?

var a = ['dog', 'cat', 'hen']; a[100] = 'fox';

console.log(a.length);

a)

101

b)

3

c)

4

d)

100

36.

Quel Voiture sera connecté à la console?

var carList = ['Tesla', 'Ford', 'Toyota', 'Honda'];

carList.pop();

console.log(carList.pop());

a)

Tesla

b)

Ford

c)

Toyota

d)

Honda

37.

Quelle méthode n'existe pas dans le DOM ?

a)

document.getElementById

b)

document.getElementsByClassName

c)

document.getElementsByAttribute

d)

document.getElementsByTagName

38.

Comment déclare-t-on une fonction fléchée en JavaScript ?

a)

function myFunction() {}

b)

const myFunction = () => {}

c)

let myFunction() = {}

d)

def myFunction() {}

39.

Quelle est la méthode utilisée pour sélectionner un élément HTML par son ID en JavaScript ?

a)

getElementByTagName()

b)

getElementsByClassName()

c)

getElementByid()

d)

Aucun

40.

Qu'est-ce que l'opérateur "===" en JavaScript ?

a)

Il teste l'égalité des valeurs sans vérifier le type

b)

Il teste si une valeur est strictement supérieure à une autre

c)

Il teste l'égalité des valeurs et des types

d)

Il teste si une valeur est strictement inferieure à une autre

41.

Que retournera l'expression 5 == "5" en JavaScript ?

a)

false

b)

true

c)

null

d)

undefined

42.

Que retournera l'expression true + true en JavaScript ?

a)

true

b)

"true"

c)

2

d)

false

43.

Laquelle des propriétés CSS suivantes est utilisée pour définir un délai avant le démarrage d'une animation ?

a)

transition-delay

b)

transform-delay

c)

delay

d)

aucune

44.

Laquelle des propriétés CSS suivantes est utilisée pour définir le temps nécessaire au commencement d'une itération d'une animation ?

a)

animation-duration

b)

duration

c)

transition-duration

d)

transform-duration

45.

Que signifie API ?

a)

Application Programming Interface

b)

Ale Pale Indian

c)

Algorithmic Processing Interface

d)

Artificial Programming Intelligence

46.

À quoi sert Postman ?

a)

Faire des requêtes HTTP

b)

Générer une API

c)

Envoyer une lettre

d)

Faire du jetpack

47.

La fonction fetch peut prendre un ou deux paramètres : URL et options. Lequel est obligatoire ?

a)

URL

b)

Option

48.

Comment rendre cette fonction asynchrone :

function callAPI(url) {

return await fetch(url);

}

a)

async function callAPI(url) {

return await fetch(url);

}

b)

function callAPI(url) {

return fetch(url);

}

c)

delayed function callAPI(url) {

return await fetch(url);

}

d)

function callAPI(async url) {

return await fetch(url);

}

49.

@media only screen and (max-width: 500px) { body { background-color: lightblue; } }
permet de quoi?

a)

La couleur d'arrière-plan deviendra bleu clair


b)

Si la fenêtre du navigateur est plus grande que 500px, la couleur d'arrière-plan deviendra bleu clair

c)

Si la fenêtre du navigateur est inférieure à 500 px, la couleur d'arrière-plan deviendra bleu clair.

50.

Parmi les balises suivantes lesquelles sont des balises sémantiques ?

a)

<article>

b)

<section>

c)

<form>

d)

<address>

e)

<div>

51.

Qu'adviendra-t-il du texte en bleu ? <p>Il a utilisé sa voiture <i>Audi</i>, car elle était très rapide.

a)

le contenu sera affiché en italique

b)

le contenu sera affiché comme une icone

c)

le contenu affichera une image

d)

le contenu définit le texte inséré dans un document

e)

Aucune de ces réponses

52.

Ecrivez un code HTML permettant de créer un tableau de 3 lignes et deux colonnes

4 lines
53.

Chaque cellule du tableau peut être représentée en utilisant

a)

<th>

b)

<td>

c)

<tr>

d)

<thead>

54.

Quel est le type par défaut de l'attribut « type » de l'élément <input> ?

a)

number

b)

password

c)

text

55.

Quel type est utilisé pour créer une saisie(input) de texte multiligne ?

a)

text

b)

textarea

c)

email

d)

multi-line

56.

Quel attribut n'est pas utilisé pour le type de radio ?

a)

name

b)

value

c)

checked

d)

selected