CODEWITHSUNDEEP
javascriptjqueryhtml
Lucinka
Lucinka

Reputation: 9

How to include a js file for a different version of jquery (one that supports IE8)?

I have a simple webpage, it is just some css and html. I need to include mobile nav using jquery and it also needs to be compatible with IE8.

I found out that IE8 supports version 1.1.9 of jquery and I also found how to use these different version depending in which browser my site is loaded.

My question is do I need to also include in my html in script tag different js file that will be run if I use jquery version for IE8? Thank you for all of your answers

    //this is what i have - before </body>

    <!--[if lt IE 9]>
      <script  src="https://code.jquery.com/jquery-1.9.0.min.js"</script>
    <![endif]-->
    <!--[if gte IE 9]><!-->
      <script src="https://code.jquery.com/jquery-3.4.0.min.js"></script>
    <!--<![endif]--> 

    //and how do I render my js file with my code? is it like this?

    <!--[if lt IE 9]>
      <script  src="https://code.jquery.com/jquery-1.9.0.min.js"</script>
      <script  src="app1.js"</script>

    <![endif]-->
    <!--[if gte IE 9]><!-->
     <script src="app2.js"></script>
    <!--<![endif]-->

Upvotes: 0

Views: 68

Answers (1)

bill.lee
bill.lee

Reputation: 2375

I will try to clarify your question in this answer.

You can conditionally include HTML code based for IE (as you have shown). The conditions do not provide scope, so you needn't respecify tags which you have already included. However, for Javascript, you will need to include the dependent files before you refer to them. So, if you are including the jquery before the closing </body> then you should include your code after it.

    <!--[if lt IE 9]>
      <script  src="https://code.jquery.com/jquery-1.9.0.min.js"</script>
      <script  src="app1.js"</script>
    <![endif]-->
    <!--[if gte IE 9]>
      <script src="https://code.jquery.com/jquery-3.4.0.min.js"></script>
      <script src="app2.js"></script>
    <![endif]--> 
    </body>

If you need to separate the inclusion of jquery from the inclusion of our own code, you needn't respecify the jquery inclusion:

    <!--[if lt IE 9]>
      <script  src="https://code.jquery.com/jquery-1.9.0.min.js"</script>
    <![endif]-->
    <!--[if gte IE 9]>
      <script src="https://code.jquery.com/jquery-3.4.0.min.js"></script>
    <![endif]--> 

... other stuff here ...

    <!--[if lt IE 9]>
      <script  src="app1.js"</script>
    <![endif]-->
    <!--[if gte IE 9]>
      <script src="app2.js"></script>
    <![endif]--> 
    </body>

Note that in these examples, you are not including jquery for non-IE browsers. If the support for IE > 9 is the same as for other browsers, then you can have the tags be included for non-IE browsers as well. The following, I use the consolidated example, at the top: 

    <!--[if lt IE 9]>
      <script  src="https://code.jquery.com/jquery-1.9.0.min.js"</script>
      <script  src="app1.js"</script>
    <![endif]-->
    <!--[if gte IE 9]><!-->
      <script src="https://code.jquery.com/jquery-3.4.0.min.js"></script>
      <script src="app2.js"></script>
    <!--<![endif]--> 
    </body>

Note that the conditional tags are actually commented out, from the point of view of non-IE browsers.

Upvotes: 1

Related Questions