nicht angemeldet
Hallo,
Kannst du mir vieleicht genauer erklären wie ich mein Script umschreiben kann damit es funktioniert??
Das Mitdenken kann ich dir nicht abnehmen. ;)
Die nötige Info habe ich dir schon gegeben: »Dann muss jede Funktion ein Objekt zurückgeben, das wieder diese Funktionen hat.«
Okay, also muss a ein Objekt zurückgeben. Du hast schon eine Andeutung gemacht, so ein Objekt zu erzeugen, mit der Object-Literalschreibweise.
Dann bau das auch zuende. Da fehlten nur die Klammern:
{
red : function() {
b.style.color = 'red';
},
blue : function() {
b.style.color = 'blue';
}
}
(Warum du da b schreiben kannst, werden wir gleich sehen.)
Jetzt, und da kommt mein Tipp, gibst du dieses Objekt als Rückgabewert zurück:
return {
red : function() {
b.style.color = 'red';
},
blue : function() {
b.style.color = 'blue';
}
};
Den Rest der Funktion hast du bereits.
Okay, warum kannst du einfach b zum Zugriff auf das Element benutzen? Wenn diese in der Funktion a notierten Funktionen als Closures wirken und die Funktionsvariablen von a nach dessen Ausführung noch konserviert werden, sodass red und blue über b auf das richtige Elementobjekt Zugriff haben.
Damit kannst du a("id").blue() schreiben.
Langfristig solltest du dich aber an das verlinkte Konzept gewöhnen.
Damit ist auch $("id").blue().red().yellow() und so weiter möglich. Das ist natürlich nur sinnig, wenn man mehrere Operationen mit demselben Element vornehmen will. Also wenn du irgendwann auf die Idee kommst, neben red und blue noch weitere Funktionen anzulegen, die du in einer Kette aufrufen willst, dann nimm das verlinkte Gerüst. Das sähe auf dem Stand deiner Anforderungen so aus:
(function() {
function _$ (id) {
this.element = document.getElementById(id);
}
_$.prototype = {
red : function () {
this.element.style.color = 'red';
return this;
}.
blue : function () {
this.element.style.color = 'blue';
return this;
}
};
window.$ = function (id) {
return new _$(id);
}
})();
Hier wird objektorientiert gearbeitet und das bekannte Object als Prototyp definiert. Ruft man $("id") auf, wird ein neues Objekt mit dem Konstruktor _$ angelegt. Im Konstuktor wird die Instanz-Eigenschaft element gesetzt, darin wird das Element gespeichert. In den Methoden red und blue greift man auf dieselbe Weise wieder darauf zu. Für die Verkettung entscheidend ist, dass blur und red die Instanz wieder zurückgeben. $("bla") hat also denselben Rückgabewert wie $("bla").red() usw.
Das ganze ist mit einer anonymen Funktion umschlossen, die sofort ausgeführt wird. Sinn davon ist, dass _$ keine globale Variable wird, sondern nur $.
Mathias