概要
この CSS の import.css のように、外部の JavaScript を HTML に読み込むことができます。読み込むときのパスは相対パス、サイトルートからのパス、フルパスなど、何でも大丈夫です。
複数のライブラリなどを XHTML に読み込む際、XHTML の head 要素内が script 要素だらけになるのを防ぐことが出来ます。
使い方
jsloader.js 内の conf で設定の変更が行えます。
jsloader.js のソース内の
conf = { thisName : "jsloader.js",//このJSのファイル名 loadJS : ["読み込むJSへのパス1","読み込むJSへのパス2","読み込むJSへのパス3","読み込むJSへのパス4"]//JS達のパス。相対で指定したい場合はこのJSからみたパス }
を変更することで設定の変更が行えます。読み込む JavaScript へのパスついては増減は自由です。
次に、ダウンロードした jsloader.js を XHTML ファイルの head 要素内などで読み込んでください。
<script type="text/javascript" src="js/jsloader.js"></script>
ソースコード
/*==================================================================================================== ////////////////////////////////////////////////////////////////////////////////////////////////////// Author : http://www.yomotsu.net created: 2007/11/01 update : 2007/12/22 Licensed under the GNU Lesser General Public License JSを読み込むためのスクリプト ////////////////////////////////////////////////////////////////////////////////////////////////////// ====================================================================================================*/ var yomotsuLoader = { conf : { thisName : "jsloader.js", loadJS : ["alert1.js","../js2/alert2.js"] }, main : function(){ var script = document.getElementsByTagName("script"); for(i=0;i<script.length;i++){ if(script[i].getAttribute("src").indexOf(yomotsuLoader.conf.thisName)!=0){ locationStr = location+"" var DirArray = new Array(); N=0; while (true) { DirArray[N] = locationStr.slice(0,locationStr.indexOf("/")); locationStr = locationStr.slice(locationStr.indexOf("/")+1,locationStr.length); N++; if (locationStr.indexOf("/")==-1) { break; } } var scriptSrc = script[i].getAttribute("src"); scriptSrc = scriptSrc.replace(/\.\.\//g, ""); var upperDirLength = script[i].getAttribute("src").match(/\.\.\//g) ? script[i].getAttribute("src").match(/\.\.\//g).length : 0 ; var thisDir = "" for(j=0;j<(DirArray.length - upperDirLength);j++){ thisDir += DirArray[j]+'/' } thisDir = thisDir.slice(0, -1) + '/' + scriptSrc ; thisDir = thisDir.slice(0,-1 * yomotsuLoader.conf.thisName.length) for(j=0;j<yomotsuLoader.conf.loadJS.length;j++){ if (!yomotsuLoader.conf.loadJS[j].match(/^\/|^http\:|^https\:|^\.\.\//)) { yomotsuLoader.writeJS(thisDir+yomotsuLoader.conf.loadJS[j]) } else if (yomotsuLoader.conf.loadJS[j].match(/^\/|^http\:|^https\:/)) { yomotsuLoader.writeJS(yomotsuLoader.conf.loadJS[j]) } else if (yomotsuLoader.conf.loadJS[j].match(/^\.\.\//)) { var writeDirArray = new Array(); writeDir = thisDir; N=0; while (true) { writeDirArray[N] = writeDir.slice(0,writeDir.indexOf("/")); writeDir = writeDir.slice(writeDir.indexOf("/")+1,writeDir.length); N++; if (writeDir.indexOf("/")==-1) { break; } } upperDirArray = yomotsuLoader.conf.loadJS[j].match(/\.\.\//g); var dir ="" for(k=0;k<(writeDirArray.length - upperDirArray.length);k++){ dir += writeDirArray[k]+'/' } // remove "../" yomotsuLoader.conf.loadJS[j] = dir + yomotsuLoader.conf.loadJS[j].replace(/\.\.\//g, "") yomotsuLoader.writeJS(yomotsuLoader.conf.loadJS[j]) } } break; } } }, // END OF yomotsuLoader.main writeJS : function(filePath){ script = document.createElement("script"); script.setAttribute("src",filePath); script.setAttribute("type","text/javascript"); document.getElementsByTagName("head")[0].appendChild(script); } } yomotsuLoader.main()
トラックバックURI
http://www.yomotsu.net/lab/javascripts/jsloader/trackback
この記事へのコメントはまだありません
コメントフォーム
実験室に戻る