loading jQuery from Googles CDN first, then local server second

Question

Scenario:

I'd like to load the jQuery and jQuery UI lib from Google's CDN but if they take too long to load, then retrieve it from the local web server.

I'm using Coldfusion but I don't think that is the answer. I think I need to do something with JavaScript.

I wrapped my script src tags with cftry but that did not work.

<cftry>
    <!-- Load Jquery from Google -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
    <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/themes/<cfoutput>#css_style#</cfoutput>/jquery-ui.css" type="text/css" media="all" />
    <cfcatch type="any">
        <!-- load from local server -->
        <script src="assets/jQuery/jquery-1.7.2.min.js"></script>
        <script src="assets/jQueryUI/js/jquery-ui-1.8.7.custom.min.js"></script>
        <link rel="stylesheet" href="assets/jQueryUI/css/<cfoutput>#css_style#</cfoutput>/jquery-ui-1.8.7.custom.css" type="text/css" media="all" />
        </cfcatch>
</cftry>

score 6 · Accepted Answer · edited Nov 13 '12 at 20:10

6

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.js"></script>
<script type="text/javascript">window.jQuery || document.write("<script type='text/javascript' src='js/jquery-1.8.3.min.js'>\x3C/script>")</script>

-- corrected mixed quotes in statement. Dreamweaver reported a syntax error until that was corrected --

edited Nov 13 '12 at 20:10

Adam

43,763
16
104
144

answered Apr 26 '12 at 14:07

Jezen Thomas

13,619
6
53
91

3

Nice `or` statement there ( +1 ). @PossiblyConfusedReader, his `||` statement means `"if window.jQuery is not found (after loading Google's version), then load server jQuery"`. It's another way of saying `if(!window.jQuery) {document.write(" – Elliot Bonneville Apr 26 '12 at 14:09
1

Agreed on the or, but keep in mind, this practice of not defining script type is still new and if you want to support many of the still currently used browsers (i wish everyone was forced to upgrade) you might want to include `type="text/javascript"`. Script type is only optional in HTML5 and there (unfortunately) are still many people running browser's that haven't been updated to support HTML5. – SpYk3HH Apr 26 '12 at 14:13
so would I need apply the same logic to each of the libs I'm loading from Google's CDN, then? – HPWD Apr 26 '12 at 14:27
@JezenThomas it helped but I had an additional question your answer did not address. The additional question is, "would I need apply the same logic to each of the libs I'm loading from Google's CDN?" TIA. – HPWD Apr 27 '12 at 03:08
@SpYk3HH Leaving the type attr off will not cause any issues even in legacy browsers - http://stackoverflow.com/questions/2626563/leaving-out-type-text-javascript-language-javascript – DyeA Oct 03 '14 at 23:13
@DyeA dude ... that was posted years ago – SpYk3HH Oct 04 '14 at 20:47
@SpYk3HH Agreed, but A) ideally questions aren't left to rot, peeps will continue to look at them for quite a long time and they should be kept up to date if you come across them, and B) I believe it was an incorrect answer at the time you originally wrote it. – DyeA Oct 05 '14 at 22:36

score 0 · Answer 2 · answered Apr 26 '12 at 14:16

<script>
setTimeout(function() {
  if(window.jQuery) return;
  var n = document.getElementsByTagName("script")[0];
  n.parentNode.insertBefore(document.createElement("script"), n).src = "assets/jQuery/jquery-1.7.2.min.js";
}, 5000);
</script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>

loading jQuery from Googles CDN first, then local server second

2 Answers2