본문 바로가기

Creation/Programming

Import jQuery 2.x and 1.x according to IE version



Detect the IE version


  There are many ways to import scripts according to browser version, but It's true some internet service restrict the way to detect the browser version.


  Simple trick is here:

 

	
<!--F IE Old Version Compatible -->
<script>var ielt9 = 0;</script>
<!--[if lt IE 9]>
<link href="./images/ie.fix.css" rel="stylesheet" />
<script>ielt9 = 1</script>
<![endif]--> 
	


  Explain: ie.fix.css is not necessary. Upper code is the code in my blog's <head> tag. Look at the <!--[if lt IE 9]>. It's not end of the comment. Why? There is no '-->' in the '<!--[if lt IE 9]>'. So browser parser doesn't detect that this line is the end of the comment. Except IE 8 and IE 7. So, what happened? IE 7, IE 8 will parse the line between <!--[if lt IE 9]> and <![endif]-->. That's all. This is all behavior that we want. So tricky, right?


  We set the variable 'ielt9' in the <script> tag. And change the value if client using the old version of IE(ielt9 is set to 1).




jQuery Import


	
<script>if (ielt9 == 1) window.jQuery || document.write('<script src="./images/jquery-1.11.0.min.js"><\/script>');
else if(ielt9 == 0) window.jQuery || document.write('<script src="./images/jquery-2.1.0.min.js"><\/script>');</script> 
	

  Of course you can use the CDN server. But for me, that is not the preferring behavior. I don't trust the CDN server because I often experienced the delay of the page because of the CDN server, and It happens especially in Korea.


  Upper code is simple. If you have just made the variable named 'ielt9', just use it. According to the value of the ielt9, you can simply import the jQuery according to the IE browser version. By 'document.write' function, script can be imported dynamically.