Activités JavaScript
Activité 1 : Créer une page web intitulée calculatrice.html comme décrit ci-dessous :
Le clic sur le bouton Calculer permet :
D’afficher le message "saisir la valeur de X" si la première zone de texte est vide ou ne contenant
pas un nombre
D’afficher le message "saisir la valeur de Y" si la deuxième zone de texte est vide ou ne contenant
pas un nombre
D’afficher le résultat de l’opération
Page.html
<!DOCTYPE html>
<html> <title>Document</title>
<script language="javascript" src="calc.js"></script>
</head>
<body>
<h2>Caluclatrice</h2>
<form>
<label for="x">X</label><input type="text" name="x" id="x"><BR>
<input type="radio" name="operateur" id="somme" value="+">
<label for="somme">Somme</label>
<input type="radio" name="operateur" id="soustraction" value="-">
<label for="soustraction">Soustraction</label>
<input type="radio" name="operateur" id="multiplication" value="*">
<label for="multiplication">Multiplication</label>
<input type="radio" name="operateur" id="division"value="/">
<label for="division">Division</label><br>
<label for="x">Y</label><input type="text" name="y" id="y"> <br>
<input type="button" value="Calculer" onclick="calculer()">
<input type="reset" value="Annuler">
</form>
</body>
</html>
script js :
function calculer(){
x=document.getElementById("x").value;
y=document.getElementById("y").value;
if(x==""|| isNaN(x)){alert("saisir la valeur de x : ");}
else if(y==""|| isNaN(y)){alert("saisir la valeur de y : ");}
else{ x=parseInt(x); y=parseInt(y);
op = document.getElementsByName("operateur");
for (i = 0; i < op.length; i++) {
if (op[i].checked) { operateur=op[i].value; }
let resultat = 0;
switch (operateur) {
case "+": alert(x + y); break;
case "-": alert(x - y); break;
case "*": alert(x * y); break;
case "/": if(y==0)
{ alert("Erreur : division par zéro");break;}
else { alert(x/y); break;}
default: alert("Veuillez sélectionner un opérateur.");break;
} } }
Activité 2 : Créer une page web intitulée algorithmes.html comme décrit ci-dessous :
Le clic sur le bouton PGCD(X,Y) permet d’afficher le PGCD de X et Y
Le clic sur le bouton Factoriel(X) permet d’afficher le factoriel de X
Page html
<!DOCTYPE html><html>
<title>Document</title>
<script language="javascript" src="act2.js"></script>
<link rel="stylesheet" type="text/css" href="acti2.css">
</head>
<body>
<h2>Les algorithmes arithmetiques</h2>
<form>
<label for="x">X</label><input type="text" name="x" id="x">
<label for="x">Y</label><input type="text" name="y" id="y"> <br> <br>
<table>
<td>
<tr><input type="button" value="PGCD(x,y)" onclick="pgcd()"> </tr>
</td>
<td>
<tr><input type="button" value="factoriiel(x)" onclick="factoriel()"> </tr>
</td>
<td>
<tr><input type="reset" value="Annuler"> </tr>
</td>
</table></form></body></html>
Page js
function pgcd(){
let x=document.getElementById("x").value;
let y=document.getElementById("y").value;
if(x=="" || isNaN(x) || x<0){alert("saisir la valeur de x");}
else if(y=="" || isNaN(y) || y<0){alert("saisir la valeur de y");}
else{
x=parseInt(x); y=parseInt(y);
while(x!=y)
{ if(x>y)
x=x-y;
else
y=y-x;
}
alert("pgcd ="+x);
function factoriel(){
let x=document.getElementById("x").value;
if(x==""||isNaN(x)||x<0){ alert("saisir la valeur de x : ")}
else {
x=parseInt(x); let f=1;
for (i=2;i<=x;i++)
f=f*i
alert("factoriel("+x+")="+f);
}}
Activité 4 : Exécuter le code javascript ci-dessous et donnez le résultat des différents variables x1,
y1, z1, p1 et x2, y2, z2, p2
<!DOCTYPE html>
<html>
<head>
<Body>
<body>
<script >
x1=2; var y1=3; let z1=4 ; const p1=5 ;
function test()
{ x2=20; var y2=30; let z2=40 ; const p2=50 ; }
document.write("x1= " + x1 +"<br>" );document.write("y1=" + y1 +
"<br>" );
document.write("z1= " + z1 +"<br>" );document.write("p1=" + p1 +
"<br>" );
test();
document.write("x2= " + x2 +"<br>" );document.write("y2=" + y2+ "<br>"
);
document.write("z2= " + z2 +"<br>" );document.write("p2=" + p2 +
"<br>" );
</script>
Activité 5 : Créer une page web intitulée facteurs_premiers.html comme décrit ci-dessous sachant que le
clic sur le bouton Afficher les facteurs premiers permet :
D’afficher le message "Veuillez saisir un entier positif" si la valeur saisie dans la première zone de
texte est vide ou n’est pas un entier positif,
De chercher les facteurs premiers de l’entier saisi et de les afficher dans la deuxième zone de texte.
Pour rechercher les facteurs premiers d’un nombre, utilisez un tableau t dans lequel vous allez
stocker les facteurs premiers
page html :
<!DOCTYPE html>
<html>
<title>Document</title>
<script language="javascript" src="act5.js"></script>
<link rel="stylesheet" type="text/css" href="act5.css">
</head>
<body>
<table>
<tr><h2>Les facteurs premier d'un nombre</h2> </tr> <br>
<form>
<tr><label for="x">Saisir un entier</label><br><br><input type="text" name="x" id="x"> </tr> <br><br>
<tr><input type="button" value="Afficher les facteurs premiers" onclick="facteurs()"> </tr> <br>
<br>
<tr>
<input type="text" name="y" id="y"> <br> <br>
</tr>
</table>
</form>
</body>
</html>
Script js:
function facteurs(){
let t=new Array();
let x=parseInt(document.getElementById("x").value);
let n=0;let i=2;
while(x!=1){
if (x%i==0)
{t[n]=i; n=n+1; x=x/i;}
else
i=i+1;
let msg="";
for (J=0;J<t.length-1;J++)
{ msg=msg+t[J].toString()+"*"; }
msg=msg+t[t.length-1].toString();
document.getElementById("y").value=msg;
