JQuery ist eine Bibliothek von Routinen, die unabhängig von Javascript geschrieben wurde, aber nur in der "Javascript"-Umgebung funktioniert. Es bietet hauptsächlich einfach zu verwendende clientseitige Skriptfunktionen.
Vor jQuery war das Schreiben von JavaScript wirklich langwierig, da man dasselbe Skript auf unterschiedliche Weise schreiben musste, um allen Browsern zu gefallen. JQuery funktioniert in allen Browsern und erleichtert fast alles, was Sie in JavaScript tun müssen.
Der einzige Nachteil ist, dass Sie die jQuery-Bibliothek in Ihre Webseite einbinden müssen, sodass das Schreiben in reinem JavaScript die Ladezeit der Seite verbessert. Wenn dies ein Problem ist, sollten Sie CoffeeScript in Betracht ziehen.
Unterschied zwischen Handnotiz und Buch oder Mehr Buch und Bibliothek.
In einfachem JavaScript ist wie A,B,C,D,E,F------Z. und JQuery ist wie eine fertige Bibliothek. wo Sie leicht einige tolle Sätze und Muster greifen können, können Sie Ihr eigenes Buch schreiben.
Ein Beispiel: [Ich habe eine Geige zum besseren Verständnis gemacht :)]
Sehen Sie sich meine Geige an Oder Sie können unten lesen. In jQuery können Sie ein Objekt FadeIn oder FadeOut verwenden, indem Sie einfach Folgendes schreiben: $("#hello").fadeIn(); wo in html: <div id="hello">Welt</div> Wenn Sie versuchen, Ihre eigene Java-Script-Funktion zu schreiben, müssen Sie Folgendes schreiben:
<code>(function() {
var FX = {
easing: {
linear: function(progress) {
return progress;
},
quadratisch: function(progress) {
return Math.pow(progress, 2);
},
swing: function( progress) {
return 0.5 - Math.cos(progress * Math.PI) / 2;
},
circ: function(progress) {
return 1 - Math.sin(Math.acos(progress));
},
back: function(progress , x) {
return Math.pow(progress, 2) * ((x + 1) * progress - x);
},
Bounce: function(progress) {
for (var a = 0, b = 1, result; 1; a += b, b /= 2) {
if (progress >= (7 - 4 * a) / 11) {
return -Math.pow((11 - 6 * a - 11 * Fortschritt) / 4, 2) + Math.pow(b, 2);
}
}
},
elastisch: function(progress, x) {
return Math.pow(2, 10 * (progress - 1)) * Math.cos(20 * Math.PI * x / 3 * progress);
}
},
animieren: Funktion (Optionen) {
var start = neues Datum;
var id = setInterval(function() {
var timePassed = new Date - start;
var progress = timePassed / options.duration;
if (Fortschritt > 1) {
Fortschritt = 1;
}
options.progress = Fortschritt;
var delta = options.delta(fortschritt);
Optionen.Schritt(Delta);
if (Fortschritt == 1) {
clearInterval (id);
options.complete();
}
}, options.delay || 10);
},
FadeOut: Funktion (Element, Optionen) {
var to = 1;
this.animate({
Dauer: options.duration,
Delta: function(progress) {
progress = this.progress;
FX.easing.swing zurückgeben (Fortschritt);
},
komplett: options.complete,
Schritt: function(delta) {
element.style.opacity = to - delta;
}
});
},
FadeIn: Funktion (Element, Optionen) {
var to = 0;
this.animate({
Dauer: options.duration,
Delta: function(progress) {
progress = this.progress;
return FX.easing.swing(progress);
},
komplett: options.complete,
Schritt: function(delta) {
element.style.opacity = to + delta;
}
});
}
};
Fenster.FX = FX;
})()
</code>