How can I load resources locally instead of CDNs if they fail to load?

This piece of codewill handle script load fails, and allow you to add a fallback attribute that will be loaded instead...

var scripts = document.querySelectorAll("script[data-fallback]");

[].forEach.call(scripts, function(script) {
  var listener = script.addEventListener("error", function() {
  var newScript = document.createElement("script");
  newScript.setAttribute("src", script.getAttribute("data-fallback"));
    document.querySelector("head").appendChild(newScript);
  });
});

<script
  src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.12.4/jquery.fail"
  data-fallback="https://something-local.com/jquery.js"></script>

Note: This won't work on this page. It's just the nature of Stack Overflow's snippets. Here's a working jsfiddle demo instead...

http://jsfiddle.net/ArchersFiddle/pbfv6q4x/

If you open the console on that page you'll see the original script load error and then the output showing the fallback script was loaded.

Here's the same thing, but for stylesheets...

var stylesheets = document.querySelectorAll("link[rel=stylesheet][data-fallback]");

[].forEach.call(stylesheets, function(stylesheet) {
    var listener = script.addEventListener("error", function(e) {
    var newStylesheet = document.createElement("link");
    newStylesheet.setAttribute("rel", "stylesheet");
    newStylesheet.setAttribute("href", stylesheet.getAttribute("data-fallback"));
    document.querySelector("head").appendChild(stylesheet);
    });
});