jQuery js file 동적 로딩 하기

오늘도 jQuery 이용자를 위한 좋은 TIP 올립니다.


jQuery 작업을 하다 보면, jQuery를 동적으로 로딩하고 싶은데, 이미 로딩 되어 있으면 그럴 필요가 없다. 이럴경우 아래와 같이 동적으로 jQuery를 로딩하면 아주 편하게 사용가능 하다... 구글링하다가 조금 힌트를 얻었는데, 모든 브라우져에서 효과적을 처리하는 방법으로 수정 반영 했습니다...

<SCRIPT LANGUAGE="JavaScript"> <!-- //------------------------------------------------------------------------------------------- // jQuery script 가 browser 에 로딩되어 있지 않으면 로딩 시키도록 한다. (모든 브라우저 호환) // Created by mulder at 2010.11.14 //------------------------------------------------------------------------------------------- var jQueryLoader = { _startupJob : null, load: function(startupFunc) { _startupJob = startupFunc; if(this.jQueryLoadChecker()) { _startupJob(); } else { var fileref=document.createElement('script'); fileref.setAttribute("type","text/javascript"); fileref.setAttribute("src", 'http://code.jquery.com/jquery-1.4.4.js'); fileref.onload = _startupJob; document.getElementsByTagName("head")[0].appendChild(fileref); if (navigator.userAgent.toUpperCase().indexOf("MSIE")>-1){ this.waitForJQueryLoad(); } } }, waitForJQueryLoad: function () { setTimeout(function() { if(!jQueryLoader.jQueryLoadChecker()) { jQueryLoader.waitForJQueryLoad(); } else { _startupJob(); } }, 100); }, jQueryLoadChecker: function () { try {var win = $(window); return true;}catch(ex){ return false; } } } jQueryLoader.load( function() { alert ('loaded jQuery Version:' + jQuery.fn.jquery ); }); //--> </SCRIPT>