How To Use jQuery 3 with a Fallback to v1 (for IE8)

With the release of jQuery 3 (and recently 3.1) we as developers have been able to use many new features – as well as having performance increases (at least visually). So it’s a no brainer to use it over previous versions, or is it? With the release of the v2 branch the jQuery team announced that it wouldn’t be supporting IE6-8. And… if you’re working on commercial projects, this sucks.

Luckily you can use the latest version and fallback to an older version when using the older IE’s. We can do this by using conditional statements and letting the browser decided what it wants to use.

Note: this might *not* be a good idea in practice, as the JavaScript you write must be able to run on both versions – as well as the fact that you will need to test on both versions. But if all you’re doing is the odd fadeIn() and each() then I don’t see a problem.

<!--[if lt IE 9]>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <script>window.jQuery || document.write(';<script src="js/libs/jquery/jquery-1.12.4.min.js"><\/script>';)</script>
<![endif]-->
<!--[if gte IE 9]><!-->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.0.0/jquery.min.js"></script>
    <script>window.jQuery || document.write(';<script src="js/libs/jquery/jquery-3.0.0.min.js"><\/script>';)</script>
<!--<![endif]-->

What are your thoughts?