Introduction à javascript


D?but du script


Code JAVASCRIPT :
<script type="text/javascript">
 
   /* votre code javascript se trouve ici
   c'est deja plus pratique pour un script de plusieurs lignes */
 
</script>


Importer un fichier externe


Code JAVASCRIPT :
<script type="text/javascript" src="script.js"></script>


Quelques fonctions


Code JAVASCRIPT :
 
 
/*--------------------------------------------
Demander, cr?er  et afficher une variable
---------------------------------------------*/
var age=18;//Cr?ation d'une variable age
alert(age)//affichage de la variable age
alert("Vous avez " + age + " ans"); // Concat?nation :on affiche les chaines mises bout-?-bout
var age = prompt("Quel ?ge avez-vous ? (en ann?es)"); // on demande l'age
 
 
/*--------------------------------------------
Cr?er une fonction
---------------------------------------------*/
function conversion(taux)   // declaration de la fonction avec un argument
{
   var valeur = prompt("Entrez la valeur ? convertir");
   var resultat = valeur * taux;   // on calcule le resultat, en utilisant l'argument
   alert('Valeur  : '+valeur + '\nR?sultat : '+resultat);
   return resultat; //on retourne la valeur
}
 
/*--------------------------------------------
Tableaux
---------------------------------------------*/
var table = new Array("Pierre", "Paul", "Jacques");// tableau index?
alert(table[1]);
 
var scores = new Array();//tableau associatif
scores["Toto"] = 142;
scores["Pierre"] = 137;
alert(table["Toto"]);
table.length;//longueur du tableau
// une fonction qui retourne, sous forme de cha?ne de caract?res, le contenu du tableau 
function lire1(tab)
{
        var chaine = "Le tableau contient :"
        for(var i=0; i<tab.length; i++)
                chaine += "\n" + i + " -> " + tab[i];
        return chaine;
}
 
/*--------------------------------------------
Les objets html
---------------------------------------------*/
//Atteindre les objets
document.getElementById("id");
getElementsByTagName("textarea")//ex:retourne un tableau contenant tous les ?l?ments <textarea> de la page
document.getElementsByTagName('textarea')[1];//Si on veut acc?der au second <textarea> de la page 
 
 


Les ?v?nements


* onClick et onDblClick : lors d'un clic / double clic sur l'?l?ment en question
* onKeyPress : lorsqu'on appuie sur une touche avec cet ?l?ment s?lectionn?
* onKeyDown et onKeyUp : lorsqu'une touche est enfonc?e / rel?ch?e avec cet ?l?ment s?lectionn?
* onmouseover et onmouseout : lorsque le pointeur de la souris arrive sur l'?l?ment / sort de cet ?l?ment
* onmousemove : lors d'un d?placement de la souris au-dessus de cet ?l?ment
* onMouseDown et onMouseUp : lorsque le bouton de la souris est enfonc? / rel?ch? sur cet ?l?ment


Code JAVASCRIPT :
 
/*--------------------------------------------
Acc?der aux ?l?ments d'un formulaire
---------------------------------------------*/
var monForm = document.getElementById("monFormulaire");
var champPseudo = monForm.pseudo;
 
/*--------------------------------------------
le mot-cl? "this"
---------------------------------------------*/
 
<img src="photo.jpg" alt="" onclick="this.src='image.jpg'" />
 
 
 

Enjoyed this article? I’d be very grateful if you’d help it spread by emailing it to a friend, or sharing it on Twitter, Facebook or Linked In.

Show me some love with the like buttons below... Thank you and please don't forget to share and comment below!!
Avez vous aimé cet article? Je vous serais très reconnaissant si vous aidiez à sa diffusion en l'envoyant par courriel à un ami ou en le partageant sur Twitter, Facebook ou Linked In.

Montrez-moi un peu d'amour avec les like ci-dessous ... Merci et n'oubliez pas, s'il vous plaît, de partager et de commenter ci-dessous!





Cette page a été vue 1444 fois
Licence - Pas d?Utilisation Commerciale - Partage dans les M?mes Conditions
Licence Creative Commons