javascript引導(dǎo)程序
更新時間:2008年10月26日 16:44:00 作者:
本網(wǎng)站的javascript程序架構(gòu)從以下幾個基本點出發(fā)
1、網(wǎng)頁在加載時,頁面代碼中的js文件引用(如下)都會向服務(wù)器產(chǎn)生http請求,因為在body.onload事件之前加載的文件(這里我稱之為靜態(tài)加載文件)都會向服務(wù)器產(chǎn)生http請求。為了減少服務(wù)器的http請求,本人提倡每個頁面最多只有一個js文件引用。
<script language='Javascript' type='text/Javascript' src='?.js'></script>
2、body.onload事件之后加載文件(這里我稱之為動態(tài)加載文件)的時候,瀏覽器會先查找緩存文件,如果緩存文件不存在才會向服務(wù)器發(fā)出http請求;所以本人提倡動態(tài)加載文件,而在body.onload事件之前的靜態(tài)加載文件應(yīng)該做到精短。
3、本系統(tǒng)程序按照功能模塊劃分為單個文件,在/source/js/system.js中實現(xiàn)運行時按需下載,而不是恐怖的一次性下載所有腳本程序代碼,減少網(wǎng)絡(luò)帶寬的占用。
4、為了讓js代碼跨網(wǎng)站調(diào)用時不會出現(xiàn)編碼問題,程序中所有漢字用函數(shù)escape編碼,如果只是單網(wǎng)站使用,您可以把編碼改回漢字。
5、所有函數(shù)或類注明為“本網(wǎng)站自用”的,很可能與本網(wǎng)站后臺自定義的數(shù)據(jù)類型有關(guān),您可以將它刪除。
下面是/js/Load.js程序以及的注釋說明:
var IsBody={};
//定義動態(tài)加載js程序文件的代碼
eval("IsBody.AppendJs="+(IsBody.AppendJsCode="function(){var A=(typeof(arguments[0])=='string'?arguments:arguments[0]);for(var i=A.length-1;i>=0;i--){var J=document.createElement('script');J.language='javascript';J.type='text/Javascript';J.src=A[i];document.getElementsByTagName('head')[0].appendChild(J);}};"));
//測試document.body是否已經(jīng)加載
IsBody.Try=function()
{
if(document.body&&((this.IsIE=(document.readyState!=null))?document.readyState.toLowerCase()=='complete':true))
{ //document.body加載后判斷瀏覽器是IE還是FoxFire,本程序目前支持這兩種瀏覽器
clearTimeout(this.Interval);
if(typeof(LoadCssFile)!='undefined')
{ //動態(tài)加載css文件,目的也是減少服務(wù)器的http請求(注意這里L(fēng)oadCssFile是個數(shù)組)
var C=LoadCssFile,j=C.length,i=1;
while(i<j)
{
var J=document.createElement('link');J.rel='stylesheet';J.type='text/css';J.href=C[i++];document.getElementsByTagName('head')[0].appendChild(J);
}
}
//動態(tài)加載圖片,目的也是減少服務(wù)器的http請求
if(typeof(LoadImage)!='undefined') this.AppendJs('/source/js/LoadImage.js');
//動態(tài)加載程序主體系統(tǒng)
this.AppendJs('/source/js/System.js');
}
};
IsBody.Interval=setInterval('IsBody.Try();',100);
<script language='Javascript' type='text/Javascript' src='?.js'></script>
2、body.onload事件之后加載文件(這里我稱之為動態(tài)加載文件)的時候,瀏覽器會先查找緩存文件,如果緩存文件不存在才會向服務(wù)器發(fā)出http請求;所以本人提倡動態(tài)加載文件,而在body.onload事件之前的靜態(tài)加載文件應(yīng)該做到精短。
3、本系統(tǒng)程序按照功能模塊劃分為單個文件,在/source/js/system.js中實現(xiàn)運行時按需下載,而不是恐怖的一次性下載所有腳本程序代碼,減少網(wǎng)絡(luò)帶寬的占用。
4、為了讓js代碼跨網(wǎng)站調(diào)用時不會出現(xiàn)編碼問題,程序中所有漢字用函數(shù)escape編碼,如果只是單網(wǎng)站使用,您可以把編碼改回漢字。
5、所有函數(shù)或類注明為“本網(wǎng)站自用”的,很可能與本網(wǎng)站后臺自定義的數(shù)據(jù)類型有關(guān),您可以將它刪除。
下面是/js/Load.js程序以及的注釋說明:
復(fù)制代碼 代碼如下:
var IsBody={};
//定義動態(tài)加載js程序文件的代碼
eval("IsBody.AppendJs="+(IsBody.AppendJsCode="function(){var A=(typeof(arguments[0])=='string'?arguments:arguments[0]);for(var i=A.length-1;i>=0;i--){var J=document.createElement('script');J.language='javascript';J.type='text/Javascript';J.src=A[i];document.getElementsByTagName('head')[0].appendChild(J);}};"));
//測試document.body是否已經(jīng)加載
IsBody.Try=function()
{
if(document.body&&((this.IsIE=(document.readyState!=null))?document.readyState.toLowerCase()=='complete':true))
{ //document.body加載后判斷瀏覽器是IE還是FoxFire,本程序目前支持這兩種瀏覽器
clearTimeout(this.Interval);
if(typeof(LoadCssFile)!='undefined')
{ //動態(tài)加載css文件,目的也是減少服務(wù)器的http請求(注意這里L(fēng)oadCssFile是個數(shù)組)
var C=LoadCssFile,j=C.length,i=1;
while(i<j)
{
var J=document.createElement('link');J.rel='stylesheet';J.type='text/css';J.href=C[i++];document.getElementsByTagName('head')[0].appendChild(J);
}
}
//動態(tài)加載圖片,目的也是減少服務(wù)器的http請求
if(typeof(LoadImage)!='undefined') this.AppendJs('/source/js/LoadImage.js');
//動態(tài)加載程序主體系統(tǒng)
this.AppendJs('/source/js/System.js');
}
};
IsBody.Interval=setInterval('IsBody.Try();',100);
相關(guān)文章
用javascript實現(xiàn)的漢字簡繁轉(zhuǎn)換
用javascript實現(xiàn)的漢字簡繁轉(zhuǎn)換...2007-06-06JS運動相關(guān)知識點小結(jié)(附彈性運動示例)
這篇文章主要介紹了JS運動相關(guān)知識點,總結(jié)分析了JavaScript運動所涉及的相關(guān)知識點與注意事項,并附帶了一個JavaScript彈性運動的實例供大家參考,需要的朋友可以參考下2016-01-01javascript獲取當(dāng)前鼠標(biāo)坐標(biāo)的方法
這篇文章主要介紹了javascript獲取當(dāng)前鼠標(biāo)坐標(biāo)的方法,可針對不同瀏覽器獲取鼠標(biāo)的坐標(biāo)位置,是非常實用技巧,需要的朋友可以參考下2015-01-01CSS和JS標(biāo)簽style屬性對照表(方便js開發(fā)的朋友)
CSS和JS標(biāo)簽style屬性對照表(方便js開發(fā)的朋友),需要的朋友可以收藏下。2010-11-11