동적으로 js 파일 로드하기

지금 심심해서 만드는 짤방 사이트에 쓰고 있는건데요.

js 파일을 전체 로드할 필요없이......

필요할때만 불러서 쓰는거에여~.

FF 쓰시는 분들은 Firebug 에 보시면 HTML 탭에 head 에 script 가 생성되는거 볼수있스빈다.

IE, FF 는 되는거 확인했는데 나머지는 몰라요.......

안 깔려있어서 테스트 못해봄.

 dy_loaded = []; function dynamic_src(get_src) { try { var cnt = dy_loaded.length; var bln = false; for (var i=0;i<cnt; i++) { if (dy_loaded[i] == get_src) { bln = true; break; }; } if (bln == false) { var script = document.createElement('SCRIPT'); script.type = 'text/javascript'; script.src = get_src; script.charset = 'UTF-8'; document.getElementsByTagName('HEAD')[0].appendChild(script); dy_loaded[dy_loaded.length] = get_src; } } catch (e) { alert(e); } } function function_check(func, pars, time, src) { if (src != undefined) { dynamic_src(src); } try { eval(func+'('+pars+')'); loaded(); } catch (e) { loading(); window.setTimeout(function () { function_check(func, pars, time+1);}, 500); } }
이렇게 두개의 함수로 나눠서 쓰는데요.
head 의 자식노드로 script 를 추가하는겁니다.
function_check 함수는 뭐할때 쓰냐하면 -_-.
다른js 파일에 있는 함수를 부를때......

function_check('함수명', '인자', 0, '함수가 존재하는 js파일');

이렇게 불러서 쓰구요.
세번째 인자  time 은 다른데 쓸려고 한건데....
뭐에 쓸려고 한지 까묵음 -_-; ㅋㅋ;

dy_loaded 배열은 이미 로드한건 또 로드할 필요없이 체크할려고 둔 거구요.
head 의 자식노드 체크하는거보다 배열체크하는게 더 편해서 저렇게 한거에요.

eval 함수가 자원을 초큼 소비하긴 하지만.....
eval 말고 string 으로 넘어온걸 따로 바꾸질 못해서요.
다른 방법 좋은거 아시는분 있으시면 댓글로 달아주시면 감사.

링크에 테스트용으로 달아두었는데요.

맨 처음에 사람모양 아이콘 (login.js) 파일에 있는 함수를 부르는거구요.
글구 메뉴를 클릭하다가 보면 하위 메뉴가 없는 메뉴에서 잠깐 지연현상 보일껍니다.
그 역시 (content.js) 파일에 있는 함수를 부르는거구요.

링크에 테스트 주소 넣어둡니다.

loading(), loaded() 함수는 ajax 로드할때 빙글빙글 돌아가는 아이콘 보여주는 함수입니다.
쓰는거 그대로 올리다보니 --;
ㅈㅅ.

.