Back

Correction exercice les tableaux en javascript

Correction exercice les tableaux en javascript

    Objectif

    • Exécuter son premier script JavaScript avec un navigateur.

  1. Exercice 01

    1. Énoncé
    2. Solution
        3. <!DOCTYPE html >
<html lang="fr">
<head>
<title>JavaScript</title>
<meta ="UTF-8">
<script>
 var semaine = new Array('lun', 'mra', 'mer', 'jeu', 'ven', 'Sam','ddi');
 semaine.pop();//Retirer le dernière valeur du tableau jours
 //Afficher les valeurs du tableau en utilisant la méthode document.write
 for(var i in semaine)
    {
        document.write(semaine[i]+'</br>');
    }
semaine.push("dim");//Ajouter la valeur ‘dim’ à la fin du tableau
semaine[1]="mar";//Remplacer la valeur ‘mra’ par ‘mar’
//Afficher le nombre de valeurs du tableau en utilisant la méthode document.write 
document.write( "La taille du tableau est" + semaine.length );
//Afficher la troisième valeur du tableau
document.write( "La troisième élément du tableau est" + semaine[2] );
</script>
</head>
<body>

</body>
</html>

    3. Exercice 02

      1. Énoncé
      2. Solution
          3.  var fruits = ["Mangue", "Raisin", "Figue", "Kiwi"];
 //Affiche la liste de fruits disponibles;
 for (var i in fruits)
  {
    document.write(fruits[i] + "<br>");
  }
//Demande au client quel fruit il désire acheter:
  var demande_client = prompt("Quelle fruit voulez vous acheter");
  var trouve=0;
  var t=0;
  for (var i in fruits)
  {
    if(demande_client===fruits[i])
      {
        fruits[t]='';
        alert('ok');
        trouve=1; 
      }
      t++;   
  }
  if(trouve==0){
      document.write("</br>Indisponible</br>");
  }
  document.write("</br>Deuxième affichage</br>");
  var i=0;
  for (var i in fruits)
    {
      document.write(fruits[i] + "<br>");
    }

      3. Exercice 03

        1. Énoncé
        2. Solution
            3. <!DOCTYPE html>
<html lang="fr">
<head>
  <title>Vos tables de multiplication</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">  
  <script type="text/javascript">
        var nbr;
        var condition= false;
        do {
            nbr= prompt("Saisissez un nombre entier");
                if ((isNaN(nbr) === true) || (nbr<=0) || (nbr>20)) {
                    condition=false;
                } else {
                condition=true;
                }
        } while(condition===false);
		///////////////////////////////
		document.write("<center>");
		/** Mettre un titre pour la table*/
		document.write("<caption> Table de multiplication</caption>");
		/* Créer la table*/
		document.write("<table width='60%' border=1>");
		/* Créer la première ligne */
		document.write("<tr><td bgcolor='#FFff00'  align='center'><strong>"
        + "x" + "</strong></td>");
		for(var i=1;i<=nbr;i++)
		{
			document.write("<td bgcolor='#D1D7D6' align='center'><strong>"
            +i+"</strong></td>");
		}
		document.write("</tr>");
		/* créer les autres lignes*/
        var t=parseInt(nbr)+1;
		for(var i=1;i<t;i++)
		{/* Créer la ligne numéro i*/
			document.write("<tr>");
			document.write("<td bgcolor='#D1D7D6'  align='center'><strong>"
            +i+"</strong></td>");
            for(var j=1;j<=nbr;j++)
            {
		     /* Créer la colonne numéro j*/
		     	document.write("<td align='center'>"+i*j+"</td>");
			}
		     	document.write("</tr>");
		}
		document.write("</table>");
		
		////////////////////
    </script> 
</head>
<body>


<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>

</body>
</html>

      4. Exercice 04

        1. Énoncé
        2. Solution
            3. <!DOCTYPE html>
<html lang="fr">
<head>
  <title>Vos tables de multiplication</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/
4.4.1/css/bootstrap.min.css">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/
4.7.0/css/font-awesome.min.css">  
  <script type="text/javascript">
 function nombrepairetimpair()
  {
    var pairs=[];
	var impairs=[];
	var nbr=0;
	var i=0;
	var j=0;
    var valeur;
    var condition= false;
    var nbriteration=0;
while (nbr<7)
{
        do {
            nbriteration+=1;
            valeur = prompt("Saisir le "+(nbr+1)+" nombre");
                if ((isNaN(valeur) === true) || (valeur<9) || (valeur>99)) {
                    condition=false;
                } else {
                condition=true;
                }
        } while(condition===false);
        if(valeur%2==0){
            pairs[i]=valeur;
            i++;
        }
        else{
            impairs[j]=valeur;
            j++;
        }
	nbr++;
}
alert("Nombre des entiers pairs saisies:   "+pairs.length);
alert("Nombre des entiers impairs saisies:   "+impairs.length);
alert("Nombre d'itération fausses:   "+(parseInt(nbriteration)-parseInt(nbr)));

for(var t=0;t<pairs.length;t++){
	document.getElementById('pairs').innerHTML+=pairs[t]+'<br>';
}
for(var m=0;m<impairs.length;m++){
	document.getElementById('impairs').innerHTML+=impairs[m]+'<br>';
}
  } 
  </script> 
</head>
<body onload="nombrepairetimpair()">
	<div class="container">
		<div class="row">
	<div class="table-responsive-xl">
	<table class="table">
	<tr><td>Nombres pairs<td>Nombres impairs</td></tr>
	<tr><td><div id="pairs"></div><td><div id="impairs"></div></td></tr>
	</table>
</div>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/
3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/
1.14.7/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/
4.3.1/js/bootstrap.min.js"></script>

</body>
</html>



      5. Exercice 05

        1. Énoncé
        2. Solution
            3. <!DOCTYPE html>
<html lang="fr">
<head>
  <title>Vos tables de multiplication</title>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/
bootstrap/4.4.1/css/bootstrap.min.css">
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/
font-awesome/4.7.0/css/font-awesome.min.css">  
  <script type="text/javascript">
var num = Math.floor((Math.random() * 90) + 1)+10;
var NbEssais = 0;
function Devine() {
var choisi = document.form1.devine1.value;
NbEssais++;
//status = "Nombre d'essais : " + NbEssais;
document.getElementById('nbessaie').innerHTML =10-NbEssais;
if (choisi < num) 
document.getElementById('indice').innerHTML = 
"<font color='red'>Non, le nombre est plus grand.</font>";
if (choisi > num)
document.getElementById('indice').innerHTML = 
"<font color='red'>Non, le nombre est plus petit.</font>";
if (choisi == num) {
    window.alert("Correct ! Vous avez trouvé en " + NbEssais + "essais.");
    location.reload();
	document.getElementById('nbessaie').innerHTML =10;

    }
if (NbEssais == 10) {
    window.alert("Désolé, c'est fini. Le nombre correct était : " + num);
    location.reload();
	document.getElementById('nbessaie').innerHTML =10;

    }
}

    </script> 
</head>
<body>
	<div class="container">
		<div class="row">
			<fieldset class="border p-2">
				<legend  class="w-auto">Devinette</legend>
	<h1><font color="black">Trouver le bon nombre</font></h1>
	<hr>
	<p><font color="green" size=+1>
		Vous devez trouver un nombre entre 10 et 100. Vous n'avez que 
		<font color="red" size="12"> 
			<i id="nbessaie"></i> </font>essais.</font>
	</p>
	<form NAME="form1">
		<div class="form-group">
			<label>Entrez votre nombre</label>
			<label id="indice"></label>
	<br>
	<b><font color="green" size=+1>Votre choix :</font></b> 
	<input TYPE="text" NAME="devine1" SIZE="5"></br>
	
	<button type="button" class="btn btn-primary btn-lg btn-block mt-4" 
	onClick="Devine();">Essayer</button>
</div>
</form></fieldset>

</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/
jquery/3.3.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/
popper.js/1.14.7/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/
bootstrap/4.3.1/js/bootstrap.min.js"></script>

</body>
</html>



author avatar
Riadh HAJJI

Riadh HAJJI

You may also like

Correction exercices les évènements en JavaScript Série01
8 octobre, 2022

La syntaxe de base de Javascript Les variables en JavaScript Les opérateurs en JavaScript Les événements en javascript Exercices les opérateurs en JavaScript : Série 01 (Correction) Exercices les évènements en JavaScript : Série 01 (Correction) Correction exercices les évènements …

Exercices les évènements en JavaScript : Série 01
8 octobre, 2022

La syntaxe de base de Javascript Les variables en JavaScript Les opérateurs en JavaScript Les événements en javascript Exercices les opérateurs en JavaScript : Série 01 (Correction) Exercices les évènements en JavaScript : Série 01 (Correction) Exercices les évènements en …

Correction Exercices les Fonctions en Javascript Série 01
7 mai, 2021

Les fonctions en Javascript Les fonctions, Expressions et fonctions fléchées en Javascript Exercices les fonctions en javascript Série 01 (Correction) Correction Exercices les Fonctions en Javascript Série 01 Exercice 01 Énoncé Vous pouvez visualiser l’énoncé de l’exercice Solution Rappel Une …