Quelles sont les différences entre Jquery et Javascript ?

JQuery est une bibliothèque de routines, écrites indépendamment de javascript, mais qui ne fonctionnent que dans l'environnement "javascript". Il fournit principalement des capacités de script côté client faciles à utiliser.

Avant jQuery, l'écriture de JavaScript était très longue, car vous deviez écrire le même script de différentes manières pour plaire à tous les navigateurs. JQuery fonctionne dans tous les navigateurs et simplifie presque tout ce que vous devez faire en JavaScript.

Le seul inconvénient est que vous devez inclure la bibliothèque jQuery dans votre page Web, donc l'écriture en JavaScript pur améliorera le temps de chargement de la page. S'il s'agit d'un problème, vous pouvez envisager CoffeeScript.

Différence entre la main-note et le livre ou plus le livre et la bibliothèque.
En JavaScript simple, c'est comme A,B,C,D,E,F------Z. et JQuery est comme une bibliothèque prête. où vous pouvez facilement saisir une phrase et un modèle impressionnants pour écrire votre propre livre. 
Un exemple : [j'ai fait un violon pour mieux comprendre :)]
Voir mon  violon  Ou vous pouvez lire ci-dessous , Dans jQuery, vous pouvez utiliser un objet fadeIn ou fadeOut en écrivant simplement : $("#hello").fadeIn(); où en html : <div id="hello">World</div> si vous essayez d'écrire votre propre fonction java-script, vous devez écrire : 

<code>(function() { 
    var FX = { 
        easing : { 
            linear : function(progress) { 
                return progress ; 
            }, 
            quadratique : function(progress) { 
                return Math.pow(progress, 2); 
            }, 
            swing : function( progrès) { 
                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); 
            },
            rebond: 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 * progrès) / 4, 2) + Math.pow(b, 2); 
                    } 
                } 
            }, 
            élastique: function(progress, x) { 
                return Math.pow(2, 10 * (progress - 1)) * Math.cos (20 * Math.PI * x / 3 * progress); 
            } 
        }, 
        animer : function(options) { 
            var start = new Date ; 
            var id = setInterval(function() { 
                var timePassed = new Date - start;
                var progress = timePassed / options.duration; 
                if (progrès > 1) { 
                    progrès = 1; 
                } 
                options.progress = progrès; 
                var delta = options.delta(progrès); 
                options.step(delta); 
                if (progress == 1) { 
                    clearInterval(id); 
                    options.complete(); 
                } 
            }, options.delay || dix); 
        }, 
        fadeOut : fonction(élément, options) { 
            var to = 1 ; 
            this.animate({ 
                durée: options.duration,
                delta : function(progress) { 
                    progress = this.progress ; 
                    retourner FX.easing.swing(progress); 
                }, 
                complétez : options.complete, 
                étape : function(delta) { 
                    element.style.opacity = to - delta ; 
                } 
            }); 
        }, 
        fadeIn: function(element, options) { 
            var to = 0; 
            this.animate({ 
                duration: options.duration, 
                delta: function(progress) { 
                    progress = this.progress; 
                    return FX.easing.swing(progress);
                }, 
                complétez : options.complete, 
                étape : function(delta) { 
                    element.style.opacity = to + delta ; 
                } 
            }); 
        } 
    } ; 
    fenêtre.FX = FX; 
})() 

</code>