Rev. 2.73

RadRails의 파일 인클루드 방식을 자바스크립트로 흉내내어 보았습니다. 인자로 파일명을 문자배열로 넘기면 순차적으로 로드합니다. Prototype.js를 사용하며 Ajax로 구현된 별도의 페이지에 필요한 라이브러리를 개별적으로 로드할 때 사용하면 편리합니다.

/**
  * Include javascript and stylesheet tags
  * Usage = Include.JS||CSS('fileName' || ' file Name1, fileName2 , fileName3');
  * @author firejune<firejune.com>
  */

var Include = {
    getArray: function (files){
        var array = new Array();
        files.split(',').each(function (fileName){
            fileName = fileName.replace(/^\s/, '').replace(/\s$/, '');
            array.push(fileName);
        });
        return array;
    },
    JS: function (files){
        this.getArray(files).each(function (fileName){
            var JS  = document.createElement('script');
            JS.type = 'text/javascript';  
            JS.src  = '/javascripts/' + fileName + '.js';   //Path of your Javascript files
            document.getElementsByTagName('head')[0].appendChild(JS);
        });
    },
    CSS: function (files){
        this.getArray(files).each(function (fileName){
            var CSS   = document.createElement('link');
            CSS.rel   = 'stylesheet';
            CSS.type  = 'text/css';
            CSS.href  = '/stylesheets/' + fileName + '.css'; //Path of your Stylesheet files
            CSS.media = 'screen';
            document.getElementsByTagName('head')[0].appendChild(CSS);
        });
    }
};

Include.JS(' file Name1, fileName2 , fileName3');

덧. 자바스크립트 동적호출 구현하기 프로젝트로 이어집니다.

Comments

Got something to add? You can just leave a comment.

Your Reaction Time!

captcha

avatar