一个ASP.NET的JS管理方案,欢迎讨论、拍砖 场景:在自定义控件、用户控件、页面、后台代码都会有引用JS的可能,这就会出现混乱或者重复引用的可能。 一个自定义控件,用于在ASPX页
场景:在自定义控件、用户控件、页面、后台代码都会有引用JS的可能,这就会出现混乱或者重复引用的可能。
一个自定义控件,用于在ASPX页面中注册JS:
public class Script : Control { #region 属性 private string m_Src; /// <summary> /// 脚本文件路径 /// </summary> public string Src { get { return m_Src; } set { m_Src = value; } } #endregion /// <summary> /// 在控件Init的时候将JS路径添加到HttpContext.Current.Items["IncludedJavaScript"]中。 /// </summary> /// <param name="e"></param> protected override void OnInit(EventArgs e) { base.OnInit(e); if (!string.IsNullOrEmpty(Src)) { string src = ResolveUrl(Src); List<string> includedJs = HttpContext.Current.Items["IncludedJavaScript"] as List<string>; if (null == includedJs) { includedJs = new List<string>(); HttpContext.Current.Items["IncludedJavaScript"] = includedJs; } if (!includedJs.Contains(src)) { includedJs.Add(src); } } } }
一个静态类,用于管理JS和在后台代码(cs文件)中注册JS:
/// <summary> /// Javascript管理器 /// </summary> public static class JavaScriptManager { /// <summary> /// 包含JS引用。 /// </summary> /// <param name="filePaths"></param> public static void Include(params string[] filePaths) { HttpContext context = HttpContext.Current; if (null == context) { throw new Exception("HttpContext为空。"); } System.Web.UI.Page p = context.CurrentHandler as System.Web.UI.Page; if (null == p) { throw new Exception("HttpContext.CurrentHandler不是Page。"); } IList<string> jss = GetIncludedJavaScript(); string resolveUrl; foreach (string filePath in filePaths) { resolveUrl=p.ResolveUrl(filePath); if (!jss.Contains(resolveUrl)) { jss.Add(p.ResolveUrl(resolveUrl)); } } } /// <summary> /// 获取已经包含的JS列表 /// </summary> /// <returns></returns> public static IList<string> GetIncludedJavaScript() { HttpContext context = HttpContext.Current; if (null == context) { throw new Exception("HttpContext为空。"); } IList<string> jss = HttpContext.Current.Items["IncludedJavaScript"] as IList<string>; if (null == jss) { jss = new List<string>(); HttpContext.Current.Items["IncludedJavaScript"] = jss; } return jss; } }
然后写一个基类页面,所有的页面都要继承自这个基类页:
public class BasePage : System.Web.UI.Page { public BasePage() { } #region 注册/管理JS引用 /// <summary> /// 将引用的JS添加到Page.Head中。 /// </summary> private void InitJS() { IList<string> includedJs = JavaScriptManager.JavaScriptManager.GetIncludedJavaScript(); foreach (string jsFilePath in includedJs) { var script = new HtmlGenericControl("script"); script.Attributes["type"] = "text/javascript"; script.Attributes["src"] = jsFilePath; Page.Header.Controls.Add(script); } } /// <summary> /// 在呈现之前注册JS /// </summary> /// <param name="e"></param> protected override void OnPreRender(EventArgs e) { base.OnPreRender(e); InitJS(); } #endregion }
上面是在OnPreRender中将JS注册到Page.Head中的,所以如果在自定义控件中注册JS引用,请在OnPreRender之前引用。
在ASPX页面中注册JS:
<html xmlns="http://www.w3.org/1999/xhtml" > <head runat="server"> <title></title> <lulu:Script runat="server" ID="Script1" Src="~/Test/aspx.js"></lulu:Script> </head> <body> <form id="form1" runat="server"> <div> <lulu:Script runat="server" ID="Script5" Src="~/Test/aspx.js"></lulu:Script> <lulu:Script runat="server" ID="Script6" Src="~/Test/aspx2.js"></lulu:Script> <lulu:Script runat="server" ID="Script7" Src="~/Test/aspx.js"></lulu:Script> </div> </form> </body> </html>
在CS页面中注册JS:
public partial class _Default : BasePage { protected void Page_Load(object sender, EventArgs e) { JavaScriptManager.JavaScriptManager.Include("~/JS/cs.js", "~/JS/cs.js", "~/JS/cs.js2", "~/JS/cs.js"); } }
最终生成的页面:
在这里是使用HttpContext.Current.Items来保存包含的JS列表。欢迎讨论、改进。
测试代码:JsManager.rar