Salut,
a écrit :
? rajouter entre parenthèses ce qu'est un contenu optionnel, ou dans un pop up css pour pas alourdir visuellement le doc..., pour ma part je ne me représente qu'a moitié ce que peut être un contenu optionnel)
Pour répondre à cette question, je te renvoie sur
cette page. Comme tu peux le voir, si tu cliques sur le lien, une popup avec un bouton de fermeture apparaît. Désactive maintenant Javascript et regarde ce qu'il se passe... La page qui se trouvait dans la popup apparaît dans la page courante mais sans le bouton. C'est le bouton le contenu optionnel. Sans JS, il est inutile et c'est pourquoi il est généré via JS. Je disais donc de ne réserver les méthodes d'écriture qu'à cet usage.
a écrit :
Pour le modèle objet, montrer quelle portion de l'objet est un méthode, quelle portion est une propriété, qu'est ce qu'un argument et ou on le déclare...c'est confus tout ça pour un débutant.
Le schéma est le suivant :
var objet =
{
label1 : type1,
label2 : type2
};
En gros,
- on déclare chaque objet à l'aide de var
- toute instruction Javascript se finit par un point virgule.
- une propriété de l'objet est représentée par
label1 : type1
- chaque propriété d'un objet est séparé par une virgule.
Dans le tuto, je précise à un moment :
a écrit :
(...)On y retrouve la propriété __Alert exprimée à l'aide d'un label puis de deux points suivi du type de la propriété. Cette propriété est une méthode de l'objet oK64.(...)
... car
toute méthode est une propriété de l'objet. Une méthode est une suite d'instructions. Elle est inactive tant qu'on ne l'appelle pas (comme une fonction).
exemple de méthode:
var oTest =
{
__Alert: function( argument )
{
alert( argument );
}
};
Pour appeler ta méthode, tu dois la lancer sous forme d'instruction en renseignant l'argument (s'il y en a un) :
oTest.__Alert("coucou");
Généralement, tu appelles une méthode lorsque tu utilises un gestionnaire d'événement tel que onclick, onmouseover, etc...
Si on prend le code suivant :
var oK64 =
{
__Alert : function(a)
{
var oP = document.getElementsByTagName('p')[0];
oP.onclick = alert(a);
}
};
window.onload = oK64.__Alert("coucou");
Tu charges la méthode __Alert au lancement de la page et tu t'attends à ce que çà lance une alerte "coucou" lorsque tu cliques sur le premier paragraphe. Et ben non ! Lorsque la page se charge, l'alerte arrive avant même que tu ais cliqué sur le paragraphe car la variable est automatiquement transmise. J'ai parlé de constante et il est vrai que c'est inadapté... (Je vais corriger) Disons que ce qu'il faut, c'est ne pas passer d'argument sur la méthode que tu envois.
Pour obtenir le résultat souhaité, tu dois donc initialiser ta méthode comme suit :
var oK64 =
{
__Init : function()
{
var oP = document.getElementsByTagName('p')[0];
oP.onclick = function()
{
oK64.__Alert("coucou");
};
},
__Alert : function(a)
{
alert(a);
}
};
window.onload = oK64.__Init;
Comme tu peux le voir, on envoit aucun argument sur le onload ni sur le onclick. Dans ce cas, çà marche correctement.
Disons que maintenant, tu souhaites lancer deux instructions sur le onclick, par exemple, deux alertes (çà pourrait être une autre méthode). Il te faut écrire ceci :
var oK64 =
{
__Init : function()
{
var oP = document.getElementsByTagName('p')[0];
oP.onclick = function()
{
oK64.__Alert("coucou");
oK64.__Alert("salut");
};
},
__Alert : function(a)
{
alert(a);
}
};
window.onload = oK64.__Init;
Là, tu obtiens bien tes deux alertes dans l'ordre dans lequel sont passées les deux instructions. Tu peux bien sûr en mettre autant que tu veux.
Si tu lances deux onclick sur le même objet, le second onclick écrase le premier. (principe de fonctionnement du DOM-0) Certes, il existe bien une méthode en DOM-2 pour que çà n'arrive pas (addEventListener) mais on rentre dans la gestion des événements, ce que j'ai souhaité éviter car là, çà devient plus hard à comprendre. IE, comme à son habitude, ne fait pas comme tout le monde ; il se sert de la méthode attachEvent qui n'est pas réellement équivalente à addEventListener) Si je mets çà dans le tuto, à coup sûr, la plupart décroche... C'est d'ailleurs pour çà que j'ai du mal sur le tuto des menus déroulants !
Bref, essaye déjà de t'accomoder du DOM-0, le reste viendra plus tard...
a écrit :
Pourquoi le "p" dans la première alert() est en minuscule et les autres ensuite en majuscules ?
Erreur d'inattention !
Lorsque j'ai mis "p", c'était la valeur de l'argument. Dans la méthode, j'ai mis sP qui est l'argument. L'intérêt de créer des fonctions à argument(s), c'est qu'elles sont réutilisables. (Exemple : Les deux alertes du code ci-dessus, je peux mettre n'importe quelle valeur dans mes alertes)
J'espère que c'est un peu plus clair...
C'est vrai que pour comprendre ce tuto, certaines connaissances sont préférables mais ce n'est qu'une question d'exercice. Pour tout dire, je n'ai jamais codé autrement qu'en suivant le modèle objet. Je l'ai suivi dès le départ sans rien connaître au JS donc j'ai toutes les raisons de croire que tu vas y arriver.
En tout cas, je te remercie d'avoir bosser dessus... Cà me montre quelles sont les imprécisions.