JavaScript

  1. L'instruction if

  2. Le code

      if (val <10)
        document.write(val+" est inférieur a 10");
      else 
        if(val < 20)
          document.write(val+" est supérieur  a 10 et inférieur à 20");
        else
          document.write(val+" est supérieur  a 20");
    	

    Résultat :

    Résultat:
    valeur de val :
  3. L'instruction switch

  4. Le code

      var text=new String();
      switch(val)	
        {
        case 'tata' :
          text="Vous avez tapé tata";
          break;
        case 12 :
          text="Vous avez rentré le nombre 12";	
          break;
        default:	
          text="La valeur entré est ni tata ni 12";
          break;
        }
        document.write(text);
    	

    Résultat :

    Résultat:
    valeur de val :
  5. La boucle for

  6. Le code

      var i,j;
      document.write("<table align='center' border='1mm'>\n");	
      for(i=0;i<5;i++)
        {
          document.write("<tr>\n");
          for(j=0;j<5;j++)	
    	document.write("<td>"+i*j+"</td>");	
          document.write("</tr>\n");
        }	
      document.write("</table>");
    	

    Résultat :

    Résultat:

    Notez la génération de code HTML à partir du Javascript.

  7. La boucle while

  8. Le code

      var text=new String();
      var i=100;
      while(i%val != 0)	
        {
          text+=i+"<br/>";
          i++;
        }
    document.write(text);
    	

    Résultat :

    Résultat:
    valeur de val :
  9. La boucle do while

  10. Le code

      var text=new String();
      var i=100;
       do
        {
          text+=i+"<br/>";
          i++;
        }
      while(i%val != 0);	
    document.write(text);
    	

    Résultat :

    Résultat:
    valeur de val :
  11. Les tableaux

  12. Le code

      var tab=new Array(10);
      var i;
      for(i=0;i<tab.length;i++)
        tab[i]=i;	
      document.write("<table border='1mm'>");
      document.write("<tr><td>init</td><td>");
      document.write( tab.toString()+"</td></tr>");
    
      document.write("<tr><td>shift</td><td>");
      tab.shift();
      document.write(tab.toString()+"</td></tr>");
    
      document.write("<tr><td>unshift(0)</td><td>");
      tab.unshift(0);
      document.write(tab.toString()+"</td></tr>");
    
      document.write("<tr><td>push(10)</td><td>");
      tab.push(10);
      document.write(tab.toString()+"</td></tr>");
    
      document.write("<tr><td>pop()</td><td>");
      tab.pop();
      document.write(tab.toString()+"</td></tr>");
    
      document.write("<tr><td>reverse()</td><td>");
      tab.reverse();
      document.write(tab.toString()+"</td></tr>");
    
      document.write("<tr><td>sort()</td><td>");
      tab.sort();
      document.write(tab.toString()+"</td></tr>");
    
      document.write("<tr><td>retour du splice(0,3,'a','b','c')</td><td>");
      document.write(tab.splice(0,3,'a','b','c')+"</td></tr>");
      document.write("<tr><td>résultat du splice(0,3,'a','b','c')</td><td>");
      document.write(tab.toString()+"</td></tr>");
    
      document.write("</table>");
    	

    Résultat :

    Résultat:
  13. Les fonctions

  14. Le code

    function expo(val)	
    {
      if(val == 0)	
        return 1;
    
      return val*expo(val-1);
    }
      document.write("Résultat: "+expo(val));
    	

    Résultat :

    Résultat:
    valeur de val :
  15. Les classes

  16. Le code

    function aire()
    {
      return this.largeur*this.auteur;
    }
    function Rectangle(x,y)
    {
      this.largeur=x;
      this.hauteur=y;
      this.aire=aire;
    }
      var rect=new Rectangle(x,y);
      document.write("Aire : "+rect.aire());
    	

    Résultat :

    Résultat:
    valeur de x : valeur de y :
  17. L'objet Math

  18. Le code

    var a = 5+ "007";
    var b = 5+ parseInt("007");
    var c = 2+ parseFloat("1.1416");
    var d=255;
    var e="2*Math.cos(3.14)";
    with (document)
    {
    write(" a,b,c = "+a+", "+b+", "+c+"<br/>");
    write(d+ " en hexa :"+ d.toString(16)+"<br/>");
    write(e+"="+eval(e));
    }
    	

    Résultat :

    Résultat:
  19. Les images

  20. Le code

    var tab_image = new Array(2);
    for (var i=0; i< tab_image.length;i++)
    {
      tab_image[i]= new Image();
    }
    tab_image[0].src='../IMAGES/next.jpg'
    tab_image[1].src='../IMAGES/previous.jpg'
    
    var n=0;
          
    function change() 
    {
      if(isNaN(n))
        n=0;
      n= ++n;
      if (n == tab_image.length) 
        n=0;
      var img=getobj('rollover');
      img.src=tab_image[n].src;
    }
    	
    en JavaScript et
          <img id="rollover" onmouseover="JavaScript:change()"
    	onmouseout="JavaScript:change()"
    	src="../IMAGES/next.jpg">
    	
    en HTML donnent le résultat suivant. Passez la souris sur la flèche.

    Résultat :

  21. La classe Date

  22. Le code

      var jours=new Array("Lundi", "Mardi","Mercredi","Jeudi","Vendredi","Samedi","Dimanche");
      var mois=new Array("Janvier",
    		     "Février",
    		     "Mars",
    		     "Avril",
    		     "Mai",
    		     "Juin",
    		     "Juillet",
    		     "Aout",
    		     "Septembre",
    		     "Octobre",
    		     "Novembre",
    		     "Décembre");
      var ma_date=new Date();
      var Jour=jours[ma_date.getDay()];
      var Mois=mois[ma_date.getMonth()];
      var annee=ma_date.getFullYear();
      document.write(Jour+" "+ma_date.getDay()+" "+Mois+" "+annee);
    	

    Résultat :

    Résultat:
  23. Les boîtes de dialogue

  24. 	<input type="submit" value="confirm" onclick="confirm('Confirmer');return true;">
    	<input type="submit" value="alert" onclick="alert('alerte!');return true;">
    	<input type="submit" value="prompt" onclick="return demander();">
    	avec :
    function demander() { var val=prompt("Entrez une valeur"); confirm("Vous avez entré : "+val); return true; }


luc.brun@free.fr
Last modified: Fri Feb 10 16:22:09 CET 2006