Comment faire du chainage de méthode ( comme jquery)

**le_chomeur** · 25/10/2007, 14h38

Bonjour a tous , je cherche a implémenter dans mes scripts, le chainage de méthode , comme j'ai pu voir dans les framework jquery et autre ...
Je n'ai pas trouvé de documentation sur la création/héritage de tel méthode sur le net si quelqu'un pouvais éclairer ma lanterne ou me donner quelques exemples ?

Merci à tous ^^

Voici un petit exemple pour illustrer mes propos :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
 
<HTML>
<HEAD>
<SCRIPT type="text/javascript">
function testDiv(element){
 
	this.element = document.getElementById(element);
	this.borderRed = function(){
 
		this.element.style.border = '2px solid red';
		return element;
	}
 
	this.green =  function() {
	 this.element.style.backgroundColor = 'green';
	 return element;
	}
}
 
function go(){
		var maDiv = new testDiv("test");
		maDiv.borderRed().green();
}
 
</SCRIPT>
</HEAD>
<BODY>
<INPUT TYPE="button" VALUE="Effectuer les modifications" onClick="go()">
<div id="test" style="border:2px solid #ccc;background-color:yellow;width:200px;height:200px;"></div>
</FORM>
</BODY>
</HTML>

j'ai donc un souçis lorsque j'essaye d'appeler la deuxième méthode ....
J'aimerais donc comprendre pour pouvoir implémenter ce type de programmation dans mes prochains scripts

**denisC** · 06/11/2007, 16h14

Envoyé par le_chomeur

J'aimerais donc comprendre pour pouvoir implémenter ce type de programmation dans mes prochains scripts

J'ai juste changé le return element en return this, et ça marche sous FFx :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
 
 
<HTML>
<HEAD>
<SCRIPT type="text/javascript">
function testDiv(element){
 
	this.element = document.getElementById(element);
	this.borderRed = function(){
 
		this.element.style.border = '2px solid red';
		return this;
	}
 
	this.green =  function() {
	 this.element.style.backgroundColor = 'green';
	 return this;
	}
}
 
function go(){
		var maDiv = new testDiv("test");
		maDiv.borderRed().green();
}
 
</SCRIPT>
</HEAD>
<BODY>
<INPUT TYPE="button" VALUE="Effectuer les modifications" onClick="go()">
<div id="test" style="border:2px solid #ccc;background-color:yellow;width:200px;height:200px;"></div>
</FORM>
</BODY>
</HTML>

Il faut bien retourner this, puisque tu veux lui appliquer d'autres méthodes après....

Bonne chance!

**le_chomeur** · 06/11/2007, 16h21

... j'ai un grand moment de solitude

erreur de noob

Merci beaucoup

**SpaceFrog** · 06/11/2007, 16h30

si ça te rassure ... j'ai pas compris le coup du thos ...
que represent this en l'occurence ?
Pour moi c'etait la fonction pas l'objet,
j'essayais de faire un

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

return this.element;

qui me paraissait plus logique ???

**le_chomeur** · 06/11/2007, 17h02

Justement je cherchais a appliquer mes modifications sur l'objet , et non sur l'élément passé en paramètre...
et en faisant return this.element je ne répondais pas a ma problématique, grossière erreur de ma part...

**denisC** · 06/11/2007, 21h31

Envoyé par le_chomeur

Justement je cherchais a appliquer mes modifications sur l'objet , et non sur l'élément passé en paramètre...
et en faisant return this.element je ne répondais pas a ma problématique, grossière erreur de ma part...

Ca me fait ça aussi. Quand on se concentre trop sur quelque chose, on finit par ne plus voir très clair....

C'est le moment d'aller prendre un café

Comment faire du chainage de méthode ( comme jquery)

JavaScript

Vue hybride

Discussions similaires

Partager

Partager