How to load different javascript libraries depending on browser?

Question

I have a library that does not work in IE unfortunately, because IE does not support promises and other html5 features. I want to keep that library for Chrome & Firefox, but use a different one for IE. How can I separate the two like following:

<!--[if IE]>
<script type="text/javascript" src="/myielib.min.js"></script>
<![else]>
<script type="text/javascript" src="/mychromelib.min.js"></script>
<![endif]-->

Obviously, conditionally formatting only works on >IE9 browsers, but I wanted something similar to this.

kaykiek · Accepted Answer · 2018-10-09 10:43:30Z

1

you can dynamic create script like:

<script>
  var element=document.createElement('script');


  if(ie){
     element.setAttribute('src', 'ieSrc');
   }else{
     element.setAttribute('src', 'otherSrc');
   }
   document.getElementById("...").appendChild(element);
  </script>

answered Oct 9, 2018 at 10:43

kaykiek

262 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

VfP Over a year ago

Thanks, I used something like in the end. Found another solution using jQuery's $.getScript but it seemed to load slower than simply creating script elements.

Code_Tech · Accepted Answer · 2018-10-09 10:40:50Z

you can use browser detection functions on your page load event:

function BrowserDetection() {
    //Check if browser is IE
    if (navigator.userAgent.search("MSIE") & gt; = 0) {
        // insert conditional IE code here
    }
    //Check if browser is Chrome
    else if (navigator.userAgent.search("Chrome") & gt; = 0) {
        // insert conditional Chrome code here
    }
    //Check if browser is Firefox 
    else if (navigator.userAgent.search("Firefox") & gt; = 0) {
        // insert conditional Firefox Code here
    }
    //Check if browser is Safari
    else if (navigator.userAgent.search("Safari") & gt; = 0 & amp; & amp; navigator.userAgent.search("Chrome") & lt; 0) {
        // insert conditional Safari code here
    }
    //Check if browser is Opera
    else if (navigator.userAgent.search("Opera") & gt; = 0) {
        // insert conditional Opera code here
    }
}

Source: https://www.learningjquery.com/2017/05/how-to-use-javascript-to-detect-browser

Collectives™ on Stack Overflow

How to load different javascript libraries depending on browser?

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related