Ci sono alcuni problemi qui. Innanzitutto, il metodo di caricamento asincrono specificato:
<script type="text/javascript" src="https://www.google.com/jsapi"></script>
<script type="text/javascript">
google.load('jquery', '1.3.1');
google.setOnLoadCallback(function() {
// do stuff
});
</script>
ha un paio di problemi. I tag di script sospendono il caricamento della pagina mentre vengono recuperati (se necessario). Ora, se sono lenti a caricare questo è male, ma jQuery è piccolo. Il vero problema con il metodo sopra è che poiché il caricamento di jquery.js avviene in modo indipendente per molte pagine, finiranno di caricarsi e renderizzarsi prima che jquery sia caricato, quindi qualsiasi stile jquery che fai sarà una modifica visibile per l'utente .
L'altro modo è:
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js"></script>
Prova alcuni semplici esempi come, avere una tabella semplice e cambiare lo sfondo delle celle in giallo con il metodo setOnLoadCallback () vs $ (document) .ready () con un carico statico jquery.min.js. Il secondo metodo non avrà sfarfallio evidente. La prima volontà. Personalmente penso che non sia una buona esperienza utente.
Ad esempio, esegui questo:
<html>
<head>
<title>Layout</title>
<style type="text/css">
.odd { background-color: yellow; }
</style>
</head>
<body>
<table>
<tr><th>One</th><th>Two</th></tr>
<tr><td>Three</td><td>Four</td></tr>
<tr><td>Five</td><td>Six</td></tr>
<tr><td>Seven</td><td>Nine</td></tr>
<tr><td>Nine</td><td>Ten</td></tr>
</table>
<script src="http://www.google.com/jsapi"></script>
<script>
google.load("jquery", "1.3.1");
google.setOnLoadCallback(function() {
$(function() {
$("tr:odd").addClass("odd");
});
});
</script>
</body>
</html>
Dovresti (vedere) apparire la tabella e poi le righe diventano gialle.
Il secondo problema con il metodo google.load () è che ospita solo un intervallo limitato di file. Questo è un problema per jquery poiché è estremamente dipendente dal plug-in. Se si tenta di includere un plug-in jquery con un <script src="...">tag e google.load()il plug-in probabilmente non funzionerà con i messaggi di "jQuery non definito" perché non è stato ancora caricato. Non vedo davvero un modo per aggirare questo.
Il terzo problema (con entrambi i metodi) è che si tratta di un carico esterno. Supponendo che tu abbia alcuni plugin e il tuo codice Javascript, puoi caricare fino a due richieste esterne per caricare il tuo Javascript. Probabilmente stai meglio ottenere jquery, tutti i plug-in rilevanti e il tuo codice e metterlo in un file minimizzato.
Da dove dovresti usare l'API delle librerie Ajax di Google per l'hosting? :
Per quanto riguarda i tempi di caricamento, in realtà stai caricando due script: lo script jsapi e lo script mootools (la versione compressa dall'alto). Quindi sono due connessioni, anziché una. Nella mia esperienza, ho scoperto che il tempo di caricamento era in realtà 2-3 volte più lento rispetto al caricamento dal mio server condiviso personale, anche se proveniva da Google, e la mia versione del file compresso era un paio di K più grande di quella di Google. Questo, anche dopo che il file è stato caricato e (presumibilmente) memorizzato nella cache. Quindi per me, dal momento che la larghezza di banda non conta molto, non importa.
Infine hai il potenziale problema di un browser paranoico che contrassegna la richiesta come una sorta di tentativo XSS. In genere non si tratta di un problema con le impostazioni predefinite, ma su reti aziendali in cui l'utente potrebbe non avere il controllo su quale browser utilizzano, per non parlare delle impostazioni di sicurezza che potresti avere un problema.
Quindi alla fine non riesco davvero a vedermi usare l'API AJAX di Google per jQuery (le API più "complete" sono in qualche modo una storia diversa) se non per pubblicare esempi qui.
srcsintassi più semplice / più sicura / più veloce che usi ora? La tua risposta è diventata sostanzialmente canonica ed entrambi i cambiamenti aiuterebbero le persone a ottenere rapidamente ciò per cui sono venute.