Wie schreib ich eigentlich jQuery selbst?

HeinzKetchup

Well-Known Member
#1
Hi!

Ich poste jetzt mal son bischen allgemeinen Blödsinn bezüglich jQuery und wie und warum geht das denn jetzt eigentlich.
Bestimmt gibt es dazu Zahlreiche erklärungen, die bereits geschrieben wurde, aber macht ja nichts.

Man könnte meinen jQuery bräuchte einen eigenen Interpreter, eine Umsetzung in eine für den Computer lesbare Sprache,
aber nein, es ist ganz "normaler" Javascript Code in der Javascript-Bibliothek vorhanden.

Anhand eines einfachen beispiels, möchte ich euch mal Zeigen wie man in jQuery die ansprache eines Elements mit "$" geschafft hat.
Dazu benötigen wir einzig und allein eine kleine Funktion.
Um das beispiel zu vereinfachen und die Ausgabe eines Arrays zu vermeiden, nehmen wir die Ansprache per ID.

Code:
<script>
function FOO (ID)
    {
        var ELEMENT = document.getElementById(ID);
        return ELEMENT;
    }
</script>
Ab jetzt haben wir eine Funktion angelegt mit der wir "document.getElementById" nie wieder schreiben müssen, es reicht ab jetzt FOO('EineID') zu schreiben.
So kürzt sich der Text den wir brauchen um das Element anzusprechen und mehr erstmal nicht.
Wie du bestimmt erstanden hast kannst du die Funktion auch einfach mit einem Dollarzeichen (function $ (ID) ) bennnen und und hast
dir dann aus EWIG VIEL SCHREIBARBEIT (document.getElementByID) dashier gemacht: $('EineId') ODER eben wie hier im beispiel FOO('EineId')

Du siehst hier, da ist kein Interpreter oder Zuaberrei nötig, nur eine ganz normale Funktion mit return Wert.

Jetzt können wir natürlich Anfangen die Funktion Foo zu erweitern - sie zum Beispiel erkennen lassen ob wir einen Tag, eine Klasse oder eine ID ansprechen.
Tun wir das doch mal - der Verwirrung wegen, lasse ich dich übergebene Variable bei dem Namen "ID" - irgendwie muss das Ding heissen und wenn dus "SCHNITZEL" nennst
Am besten erkennen wir anhand des in CSS vorgegeben Syntax ob es ein Tagname (in CSS ohne jedes Vorzeichen),
eine ID (in CSS mit einer Raute # angesprochen) oder eine Klasse (in CSS mit einem Punkt . angesprochen) ist.

Code:
<script>
    function FOO(ID)
        {
            var TAG_KLASSE_ID = ID.charAt(0);
            var ELEMENT;
            if(TAG_KLASSE_ID == '#')
                {
                    ID = ID.substring(1,ID.length);
                    ELEMENT = document.getElementById(ID);
                }
            else if(TAG_KLASSE_ID == '.')
                {
                    ID = ID.substring(1,ID.length);
                    ELEMENT = document.getElementsByClassName(ID);
                }
            else
                {
                    ELEMENT = document.getElementsByTagName(ID);
                }
            return ELEMENT;
        }
Jetzt hast du es also möglich gemacht, ein Element per ID, oder eine vielzahl von Elementen per Tag,- oder Klassennamen anzusprechen.
Voll die Zeitersparnis, gerade wenn du deine Funktion nicht FOO nennst, sondern ihr nur ein Zeichen gibts.

Kurze Erläuterung:
TAG_KLASSE_ID siziert das erste Zeichen des Übergebenen Zeichenblocks.
Dann wird geguckt, enthält TAG_KLASSE_ID ein erstes Zeichen,
welches wir innerhalb der von uns geschriebene Funktion als ID bzw. Klasse Interpretieren
und FALLS ja, hacken wir es der Übergebenen Zeichenkette raus und haben denn den Klasse bzw eben den IDNamen (der ID Name ist ja nicht '#EineID' sondern 'EineID')
Falls kein Klassen bzw Id Zeichen vorhanden ist, brauch nichts gehackt werden, es ist bereits ohne Extrazeichen.

Und so kann man sich eben recht leicht, jeh nach vorhandenem Interesse seine Eigene Javascriptbibliothek zusammenstellen, die einen genauso komplizierten oder komplizierteren Syntax als z.b. jQuery hat.

Ich kann auch gerne noch weitere beispiele Posten, aber zur Zeit kannst du jetzt ganz plötzlich eine eigene Bibliothek anfangen und ein Element schonmal mit FOO('eineID/Klasse/Tagname') ansprechen
z.b. hierfür FOO('eineID/Klasse/Tagname').className = 'neueKlasse';

Und du kannst die Funktion auch $ nennen,um coolerweise mit
$('eineID/Klasse/Tagname').className = 'neueKlasse';
anzusprechen.

Wenn ich weitermachen soll mit kleinen beispielen sagt bescheid

lg
Heinzketchup
 

HeinzKetchup

Well-Known Member
#2
Wir können hier ja mal son Klassenwettbewerb draus machen, wer findet die einfachste Methode, das angesprochene Element für eine Funktion removeClass identifizierbar zu machen.
 

HeinzKetchup

Well-Known Member
#5
Nein nein interesse mein lieber.
Guck was ja, ich erklär mich mal, bei mir überhaupt nicht mehr für euch vorgesehen ist, ist ja das ich denke bevor ich etwas schreibe. Das ist auch nicht bös gemeint, nein gut zu wissen, muss man sich dann denken.

Natürlich gibt es das schon aber darum gehts nicht. -> auch gut zu wissen.

Und was jetzt die Aufgabe ist, ist, das mal selbst zu schreiben.
Quelltextanalyse, eigenen syntax erkennen, umschsetzen in gültiges Javascript und die Funktion removeClass erneut erfinden bei gängigem Syntax von Js 'element.removeClass('class')'

Zu deinem query selector, ich hab das noch nicht gelesen ist aber SCHEINBAR mehr schreibarbeit.
Also meine lieben, ich brauch jetut n codeschnipsel der mir zeigt wie ich meinen eigenen syntax anspreche, ich wollte doch jquery selber schreiben DÜRFEN

LG
Heinzi
 

HeinzKetchup

Well-Known Member
#7
Ja ist ja gut auch du hast wieder gut am Thema vorbeigeredet.
Machst du gut mein lieber, genau das ist ja der Grund.

Man könnte über das Errorhandling gehen um einen eigenen Syntax zu klären z.b.
 

asc

Well-Known Member
c-b Experte
#8
Ich hab keine Ahnung was du möchtest oder warum das am Thema vorbei ist.
Du verstehst die Zusammenhänge halt einfach nicht und anstatt zu Fragen fährst du uns passiv-aggressiv von der Seite an.
Macht für uns dann halt auch keinen Spaß dir bei irgendwas zu helfen.

https://de.wikipedia.org/wiki/Dunning-Kruger-Effekt

Weiterhin trotzdem viel Erfolg für die Zukunft.
 
#11
Für Tutorials und monatliche Videos zum Thema Coding für App und Web haben wir einen neue Youtube Video Serie gestartet:eek:

Wir sprechen ist Session Hijacking mit PhP Storm :


https://www.youtube.com/watch?v=cs4V1gtsLCA

Würden uns freuen wenn wir damit in Zukunft Entwicklern helfen können.
Mfg Haiko :)
 
Zuletzt bearbeitet von einem Moderator:
#13
I know aber J query kommt demnächst auch als Thema, ist schon Werbung für den Kanal hast du recht aber wir sind eine der führenden App Entwicklungs Unternhemen in Deutschland und vielleicht sollte man sich das zukünftig mal gucken wie wir arbeiten, ansonsten ignoriere den Link einfach :)
 

-AB-

Well-Known Member
c-b Team
c-b Experte
#14
Na, wenn ihr schon eine der führenden App-Entwicklungs-Unternehmen in Deutschland seid, braucht ihr die Werbung ja sicher nicht mehr... :)
 

dominikb

Well-Known Member
#15
In einem Thread über die eigene Implementierung von jQuery-ähnlichen Funktionen kann man Werbung zu einem Video über Session Hijacking mit PhpStorm machen - muss man aber nicht. :)
 

asc

Well-Known Member
c-b Experte
#16
Für ein führendes App Entwicklungsunternehmen aus Deutschland hapert es aber ganz schön mit der Rechtschreibung :rolleyes:
 
Oben