Les bases de javascript¶
class et attribut¶
Pour identifier un élément avec une classe on utilise .nom_de_ma_classe
Pour identifier un élément un id #mon_id
Pour identifier un élément avec un attribut [attr=’ValeurAttr’]
Les fonctions¶
la déclaration de fonction en javascript est assez simple
function test(){
alert('test');
}
avec des paramètres
function test(p){
alert('test' + p);
}
la gestion des paramètres et la surcharge des fonctions en javascript est assez compliqué voir inexistant
ainsi le code suivant
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
// ne sera jamais exécutée
function test(p1){
alert('Version à 1 paramètre');
}
// celle-ci fonctionnera et affichera un message dans Firebug
function test(p1, p2){
alert('Version à 2 paramètres');
}
$(function(){
test('a');
test('a', 'b');
});
</script>
</head>
<body>
</body>
</html>
ne fera apparaitre que la boite ‘Version à 2 paramètres’
de plus si vous souhaitez dans la fonction
function test(p, r){
alert('test' + p);
alert('test' + r);
}
ne fournir que r, cela n’est pas possible
La gestion des valeurs par défaut peut être réalisé ainsi
function test(p, r){
p = (p ? p : "p");
r = (r ? r : "r");
alert('test' + p);
alert('test' + r);
}
Afin d’avoir des arguments dynamiques avec des valeurs par défaut il est préférable d’utiliser un framework comme JQUERY et écrire quelques choses du type
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script type="text/javascript" src="js/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
function myFunction(params) {
var properties = $.extend(
{
'Artist' : '',
'Album' : '',
'Track' : '',
'Title' : '',
'Year' : '',
'Genre' : 'Unknown',
'Format' : 'Mp3',
'Kbps' : '320',
'Disk' : ''
}, params || {} );
// afficher toutes les propriétés et leurs valeurs
for(var p in properties){
alert(p + ' = ' + properties[p]);
}
// validations
if (properties.Artist == ''){
alert('Oups, il faut au moins mettre le nom de l\'artiste');
}
}
$(function(){
myFunction({'Artist' : 'coucou',
'Album' : 'mon premier'});
});
</script>
</head>
<body>
</body>
</html>