合并網(wǎng)頁中的多個script引用實(shí)現(xiàn)思路及代碼
更新時間:2013年02月18日 10:59:49 作者:
為了更好的進(jìn)行封裝,每個實(shí)現(xiàn)不同功能的js代碼應(yīng)該有自己的js文件,這樣如果一個網(wǎng)頁中引用了多個js文件會很難管理,所以就出現(xiàn)了合并js這以說,感興趣的朋友不妨參考下本文希望對你有所幫助
為了更好的進(jìn)行封裝,每個實(shí)現(xiàn)不同功能的js代碼應(yīng)該有自己的js文件,這樣如果一個網(wǎng)頁中引用了多個js文件,如下
<script type="text/javascript" src="limit.js"></script>
<script type="text/javascript" src="select.js"></script>
<script type="text/javascript" src="rating.js"></script>
這樣網(wǎng)頁會向服務(wù)器發(fā)送3個請求,請求3個js文件,其實(shí)完全沒有必要發(fā)這么多的請求,一個足矣,下面就來介紹如何用Handler實(shí)現(xiàn)
新建一個HttpHandler
public class Handler1 : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{//原文鏈接:blog.csdn.net/bluceyoung
string[] js = context.Request.Url.LocalPath.Substring(1, context.Request.Url.LocalPath.Length - 5).Split('.');
StringBuilder sb = new StringBuilder();
foreach (string j in js)
{
sb.Append(ReadFile(j+".js"));
}
context.Response.Write(CompressStr(sb));
}
private string ReadFile(string fileName)
{
string directory = @"D:\SRC\bluceyoung\";
if (!File.Exists(directory + fileName))
{
return "";
}
string result;
using (FileStream fs = new FileStream(directory + fileName, FileMode.Open))
{
using (StreamReader sr = new StreamReader(fs))
{
result = sr.ReadToEnd();
}
}
return result;
}
private string CompressStr(StringBuilder sb)
{
while (true)
{
int length = sb.Length;
sb.Replace(" ", " ");
if (length == sb.Length)
break;
}
sb.Replace("\r\n", "").Replace("\t", "").Replace("; ", ";").Replace(" }", "}").Replace("} ", "}").Replace(" ;", ";").Replace(" {", "{").Replace("{ ", "{");
return sb.ToString();
}
public bool IsReusable
{
get
{
return false;
}
}
}
配置文件中添加節(jié)點(diǎn)
<configuration>
<system.web>
<compilation debug="true" targetFramework="4.0" />
<httpHandlers>
<add path="*.jsx" verb="*" type="BluceYoung.Handler1"/>
</httpHandlers><!--原文博客:blog.csdn.net/bluceyoung -->
</system.web>
</configuration>
頁面調(diào)用
<script src="limit.select.rating.jsx" type="text/javascript"></script>
就這樣,一個script引用就完成了多個js文件的請求,并且對文件進(jìn)行了壓縮處理
復(fù)制代碼 代碼如下:
<script type="text/javascript" src="limit.js"></script>
<script type="text/javascript" src="select.js"></script>
<script type="text/javascript" src="rating.js"></script>
這樣網(wǎng)頁會向服務(wù)器發(fā)送3個請求,請求3個js文件,其實(shí)完全沒有必要發(fā)這么多的請求,一個足矣,下面就來介紹如何用Handler實(shí)現(xiàn)
新建一個HttpHandler
復(fù)制代碼 代碼如下:
public class Handler1 : IHttpHandler
{
public void ProcessRequest(HttpContext context)
{//原文鏈接:blog.csdn.net/bluceyoung
string[] js = context.Request.Url.LocalPath.Substring(1, context.Request.Url.LocalPath.Length - 5).Split('.');
StringBuilder sb = new StringBuilder();
foreach (string j in js)
{
sb.Append(ReadFile(j+".js"));
}
context.Response.Write(CompressStr(sb));
}
private string ReadFile(string fileName)
{
string directory = @"D:\SRC\bluceyoung\";
if (!File.Exists(directory + fileName))
{
return "";
}
string result;
using (FileStream fs = new FileStream(directory + fileName, FileMode.Open))
{
using (StreamReader sr = new StreamReader(fs))
{
result = sr.ReadToEnd();
}
}
return result;
}
private string CompressStr(StringBuilder sb)
{
while (true)
{
int length = sb.Length;
sb.Replace(" ", " ");
if (length == sb.Length)
break;
}
sb.Replace("\r\n", "").Replace("\t", "").Replace("; ", ";").Replace(" }", "}").Replace("} ", "}").Replace(" ;", ";").Replace(" {", "{").Replace("{ ", "{");
return sb.ToString();
}
public bool IsReusable
{
get
{
return false;
}
}
}
配置文件中添加節(jié)點(diǎn)
復(fù)制代碼 代碼如下:
<configuration>
<system.web>
<compilation debug="true" targetFramework="4.0" />
<httpHandlers>
<add path="*.jsx" verb="*" type="BluceYoung.Handler1"/>
</httpHandlers><!--原文博客:blog.csdn.net/bluceyoung -->
</system.web>
</configuration>
頁面調(diào)用
復(fù)制代碼 代碼如下:
<script src="limit.select.rating.jsx" type="text/javascript"></script>
就這樣,一個script引用就完成了多個js文件的請求,并且對文件進(jìn)行了壓縮處理
相關(guān)文章
ASP.NET?MVC5網(wǎng)站開發(fā)之業(yè)務(wù)邏輯層的架構(gòu)和基本功能(四)
這篇文章主要為大家詳細(xì)介紹了ASP.NET?MVC5網(wǎng)站開發(fā)之業(yè)務(wù)邏輯層的架構(gòu)和基本功能,感興趣的小伙伴們可以參考一下2016-08-08.NET使用YARP通過編碼方式配置域名轉(zhuǎn)發(fā)實(shí)現(xiàn)反向代理
這篇文章介紹了.NET使用YARP通過編碼方式配置域名轉(zhuǎn)發(fā)實(shí)現(xiàn)反向代理的方法,文中通過示例代碼介紹的非常詳細(xì)。對大家的學(xué)習(xí)或工作具有一定的參考借鑒價值,需要的朋友可以參考下2022-09-09ASP.NET Core MVC過濾器運(yùn)行流程解析
這篇文章主要為大家介紹了ASP.NET Core MVC過濾器運(yùn)行流程解析,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-11-11排除JQuery通過HttpGet調(diào)用WebService返回Json時“parserror”錯誤
排除JQuery通過HttpGet調(diào)用WebService返回Json時“parserror”錯誤的解決方法。2011-10-10.NET Core Web APi大文件分片上傳研究實(shí)現(xiàn)
這篇文章主要介紹了.NET Core Web APi大文件分片上傳研究實(shí)現(xiàn),文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-11-11