[ jquery ] jquery 활용 js 파일 include 하기
작성일 18-09-27 17:08
페이지 정보
작성자 웹지기 조회 4,918회 댓글 0건본문
jquery를 이용해 js 파일들을 인클루드 하는 플러그인
먼저 include 해야할 js 파일을 한 후 순차적으로 js 파일을 인클루드
1. 기본환경설정
[code]
<script src="/common/js/jquery-1.7.1.min.js" ></script>
<script src="/common/js/jquery.extended.js" ></script>
[/code]
2. 사용법
# 방법 1
[code]
$.include(
'js/my.js', // my.js 로딩 후 my1.js 를 로딩함
$.include('js/my1.js')
);
[/code]
# 방법 2
[code]
$.include('js/my.js',
// my.js를 먼저 로딩 후 my1.js, my2.js 를 불러 들입니다.
[
$.include('js/src/my1.js'),
$.include('js/src/my2.js')
]
);
[/code]
@ jquery.extended.js 소스
[code]
/**
* $.include - script inclusion jQuery plugin
* Based on idea from http://www.gnucitizen.org/projects/jquery-include/
* @author Tobiasz Cudnik
* @link http://meta20.net/.include_script_inclusion_jQuery_plugin
* @license MIT
*/
// overload jquery's onDomReady
if ( jQuery.browser.mozilla || jQuery.browser.opera ) {
document.removeEventListener( "DOMContentLoaded", jQuery.ready, false );
document.addEventListener( "DOMContentLoaded", function(){ jQuery.ready(); }, false );
}
jQuery.event.remove( window, "load", jQuery.ready );
jQuery.event.add( window, "load", function(){ jQuery.ready(); } );
jQuery.extend({
includeStates: {},
include: function(url, callback, dependency){
if ( typeof callback != 'function' && ! dependency ) {
dependency = callback;
callback = null;
}
url = url.replace('\n', '');
jQuery.includeStates[url] = false;
var script = document.createElement('script');
script.type = 'text/javascript';
script.onload = function () {
jQuery.includeStates[url] = true;
if ( callback )
callback.call(script);
};
script.onreadystatechange = function () {
if ( this.readyState != "complete" && this.readyState != "loaded" ) return;
jQuery.includeStates[url] = true;
if ( callback )
callback.call(script);
};
script.src = url;
if ( dependency ) {
if ( dependency.constructor != Array )
dependency = [dependency];
setTimeout(function(){
var valid = true;
$.each(dependency, function(k, v){
if (! v() ) {
valid = false;
return false;
}
})
if ( valid )
document.getElementsByTagName('head')[0].appendChild(script);
else
setTimeout(arguments.callee, 10);
}, 10);
}
else
document.getElementsByTagName('head')[0].appendChild(script);
return function(){
return jQuery.includeStates[url];
}
},
readyOld: jQuery.ready,
ready: function () {
if (jQuery.isReady) return;
imReady = true;
$.each(jQuery.includeStates, function(url, state) {
if (! state)
return imReady = false;
});
if (imReady) {
jQuery.readyOld.apply(jQuery, arguments);
} else {
setTimeout(arguments.callee, 10);
}
}
});
[/code]
추천0
비추천 0
댓글목록
등록된 댓글이 없습니다.