¿Es posible cargar varias versiones diferentes de jQuery en la misma página?

Question

Estoy haciendo un bookmarklet que cargará jQuery si no se encuentra el objeto. La carga comprobará la versión de jQuery. El código es como:

(function(){ 

    var myBkl = { 
     loadScript: function(src) { 
      if(window.jQuery && window.jQuery.fn.jquery == '1.3.2'){ 
       return; 
      } 
      var s = document.createElement('script'); 
      s.setAttribute('src', src); 
      s.setAttribute('type', 'text/javascript'); 
      document.getElementsByTagName('head')[0].appendChild(s); 
     }, 
     whenLoaded: function(callback){ 
      if (typeof(window.jQuery) !== 'undefined' && window.jQuery.fn.jquery == '1.3.2') { 
       callback(window.jQuery); 
      } 
      else { 
       setTimeout((function() {myBkl.whenLoaded(callback); }), 100); 
      } 
     }, 
     init: function($){ 
      console.log($.fn.jquery); 
     } 
    }; 
    myBkl.loadScript('http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js'); 
    myBkl.whenLoaded(myBkl.init); 

})(); 

utilizo este constructor bookmarklet para crear el bookmarklet http://subsimple.com/bookmarklets/jsbuilder.htm

Obviamente, si la página ya ha cargado jQuery. La carga del script 1.3.2 sobrescribiría el objeto window.jQuery en la página. Me pregunto si de todos modos hay que dejar que 1.3.2 cargue a otra variable autodenominada? ¿Usando jQuery.noConflict(true);?

Answer 1

sospecho que ya ha visto todas las salvedades y entender puede mover jQuery para otro espacio de nombres:

//Completely move jQuery to a new namespace in another object. 

var dom = {}; 
dom.query = jQuery.noConflict(true); 

Y que los plugins probablemente no va a funcionar y se debe hacer todo esto antes de que otros scripts son cargados o usado.

buena suerte/un poco curioso para saber si esto funciona para usted ~

Answer 2

Sí. Lo tengo trabajo por este código:

(function(){ 

    var myBkl = { 
     jq: null, 
     loadScript: function(src) { 
      if(window.jQuery && window.jQuery.fn.jquery == '1.3.2'){ 
       return; 
      } 
      var s = document.createElement('script'); 
      s.setAttribute('src', src); 
      s.setAttribute('type', 'text/javascript'); 
      document.getElementsByTagName('head')[0].appendChild(s); 
     }, 
     whenLoaded: function(callback){ 
      if (typeof(window.jQuery) !== 'undefined' && window.jQuery.fn.jquery == '1.3.2') { 
       myBkl.jq = window.jQuery.noConflict(true); 
       callback(myBkl.jq); 
      } 
      else { 
       setTimeout((function() {myBkl.whenLoaded(callback); }), 100); 
      } 
     }, 
     init: function($){ 
      console.log($.fn.jquery); 
      console.log(window.jQuery.fn.jquery); 
     } 
    }; 
    myBkl.loadScript('http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js'); 
    myBkl.whenLoaded(myBkl.init); 

})(); 

Answer 3

Comprobar this blog

Usted puede utilizar el método

$.noConflict(true); 

para lograr esto. Por ejemplo:

<script src="http://code.google.com/p/jqueryjs/downloads/detail?name=jquery-1.3.2.min.js" type="text/javascript"></script> 
<script type="text/javascript"> 
    //create this naming for Jquery 1.3.2 version 
    var jQuery_1_3_2 = $.noConflict(true); 
</script> 
<script src="http://jqueryjs.googlecode.com/files/jquery-1.2.6.min.js" type="text/javascript"></script> 

Answer 4

Al ejecutar "jQuery.noConflict (true);" El código que usa la primera versión de jQuery puede romperse.
En algunos casos esto, el código ni siquiera le pertenece. Usted escribe un script, que se supone que debe agregarse a las páginas y que usa jQuery, y usted no sabe nada sobre la página de alojamiento.
Un código de alojamiento puede cargar su versión jQuery, detectar que se cargó, comenzar a trabajar con ella, luego esperar (setTimeout), y luego se inicia el código, haga "jQuery.noConflict (true);" y espera hasta que se cargue. Mientras su código espera, el control puede regresar al código de alojamiento que intenta ejecutar su jQuery y descubre que no existe.

Mi sugerencia, en este caso, es cargar el jQuery en una nueva ventana diferente, sin quitarla de la original. Luego, cuando esté cargado, use "jQuery.noConflict (true);" en la nueva ventana para copiarlo a la ventana original. Sin embargo, el nuevo objeto jQuery se está ejecutando en la nueva ventana y su documento. Así que cuando se utiliza la nueva jQuery window.document el original debe ser pasar como segundo parámetro así:

newJq("#elementInOriginalDocument", window.document).html("some text"); 

Después de mi aplicación de esta idea:

<html> 
    <head> 
     <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js"></script> 
    </head> 
    <body> 
     Test jQuery 
     <br /> 
     <span id="hostScope">hostScope</span> 
     <br /> 
     <span id="guestScope">guestScope</span> 

     <script> 
      (function(hostWin){ 
        var myBkl = { 
          win: null, 
          doc: null, 
          jq: null, 
          loadScript: function(src) { 
           if (this.doc == null){ 
            var nAgt = navigator.userAgent; 
            if ((verOffset=nAgt.indexOf("MSIE"))!=-1) { 
             var iframe = document.createElement('iframe'); 
             iframe.id = "if1"; 
             iframe.src= window.location.href; 
             document.getElementsByTagName('head')[0].appendChild(iframe); 
             this.whenIEIFrameLoaded(src, 0); 
            } else { 
             var iframe = document.createElement('iframe'); 
             iframe.id = "if1"; 
             document.getElementsByTagName('head')[0].appendChild(iframe); 
             setTimeout((function() {myBkl.whenIframeLoaded(src); }), 1); 
            } 
           } 
          }, 
          whenIframeLoaded: function(src){ 
           var oIframe = document.getElementById('if1'); 
           var newdocument = (oIframe.contentWindow || oIframe.contentDocument); 
           if (newdocument.document) { 
            newdocument = newdocument.document; 
           } 
           var newwin = oIframe.contentWindow; 

           if (newwin.document.documentElement.innerHTML){ 
            newwin.document.documentElement.innerHTML = '<!DOCTYPE html><html><head></head><body>N</body></html>'; 
           } 
           this.doc = newwin.document; 
           this.win = newwin; 

           var script = this.doc.createElement('script'); 
           script.setAttribute('src', src); 
           script.setAttribute('type', 'text/javascript'); 

           this.doc.getElementsByTagName('head')[0].appendChild(script); 
           this.whenLoaded(this.callback, 0); 
          }, 
          whenIEIFrameLoaded: function(src, times){ 
           var oIframe = document.getElementById('if1'); 

           if (oIframe && oIframe.contentWindow && oIframe.contentWindow.document && oIframe.contentWindow.document.body){ 
            var newdocument = (oIframe.contentWindow || oIframe.contentDocument); 
            if (newdocument.document) { 
             newdocument = newdocument.document; 
            } 

            var script = newdocument.createElement('script'); 
            script.setAttribute('src', src); 
            script.setAttribute('type', 'text/javascript'); 

            newdocument.getElementsByTagName('head')[0].appendChild(script); 

            this.doc = newdocument; 
            this.win = oIframe.contentWindow; 
            this.whenLoaded(myBkl.callback, 0); 
           } else { 
            if (times < 5000){ 
             times++; 
             setTimeout((function() {myBkl.whenIEIFrameLoaded(src, times); }), 2); 
            } 
           } 
          }, 
          whenLoaded: function(callback, times){ 
            if (this.win && this.win.jQuery && typeof(this.win.jQuery) !== 'undefined' && this.win.jQuery.fn.jquery == '1.3.2') { 
             myBkl.jq = this.win.jQuery.noConflict(true); 
             callback(myBkl.jq); 
            } 
            else { 
             if (times < 5000){ 
              times++; 
              setTimeout((function() {myBkl.whenLoaded(callback, times); }), 5); 
             } 
            } 
          }, 
          callback: function(loadedJq){ 
            hostWin.myJq = loadedJq; 
            //console.log("callback: The loaded jQuery ver is " + loadedJq.fn.jquery); 
            whenLoadedOut(); 
          } 
        }; 
        myBkl.loadScript('http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js'); 
      })(window); 

      function whenLoadedOut(){ 
       if (window.jQuery) { 
        //console.log("Host jQuery ver (window.jQuery.fn.jquery) is " + jQuery.fn.jquery); 
        //console.log("guest jQuery ver (window.lpJq) is " + myJq.fn.jquery); 
        $("#hostScope").html("The jQuery ver of host is " + jQuery.fn.jquery); 
        myJq("#guestScope", document).html("The jQuery ver of guest is " + myJq.fn.jquery); 
       } 
       else { 
        setTimeout((function() {whenLoadedOut(); }), 2); 
       } 
      } 
     </script> 
    </body> 
</html>