中国第一Ajax站长门户：www.okajax.com  xp系统下载

jQuery插件管理方案 - okajax.com - Ajax中国

我要投稿 会员登陆 RSS订阅 本站推荐:
您的位置： 主页 > Ajax技术 > Ajax框架学习 > jquery.js > jQuery插件管理方案

jQuery插件管理方案

2009-11-03    文章来源：互联网    浏览次数：

  jQuery发展趋势一片大好,这里向大家介绍一种管理jQuery插件的方案。可能有些人已经在系统中已经使用.使用原因：在开发过程中，jQuery插件的使用越来越多，且jQuery的某些插件是基于某些插件来使用了,且有先后顺序的问题.最初的做法:直接在页面上加载js.如下代码,其中使用了一些插件，其依赖于jQuery.其中用了一个jdMenu插件，其依赖于四个文件(jdMenu.css,jquery.js,bgiframe.min.js，positionBy.js)

  1. <link href="/App_Scripts/jPlugin/jdMenu/jquery.jdMenu.css" rel="stylesheet" type="text/css" /> 
  2. <script src="/App_Scripts/jquery.js" type="text/javascript"></script> 
  3. <script src="/App_Scripts/jPlugin/jquery-bgiframe/jquery.bgiframe.min.js" type="text/javascript"></script> 
  4. <script src="/App_Scripts/jPlugin/jdMenu/jquery.positionBy.js" type="text/javascript"></script> 
  5. <script src="/App_Scripts/jPlugin/jdMenu/jquery.jdMenu.js" type="text/javascript"></script> 
  6. <script src="/App_Scripts/jPlugin/jquery-hint/hint.jquery.js" type="text/javascript"></script> 
  7. <script src="/App_Scripts/jPlugin/utilities/customExt.js" type="text/javascript"></script> 
  8. <script src="/App_Scripts/jPlugin/cookie/cookie.pack.js" type="text/javascript"></script><title> 

上面用到的插件还不算多,在某些页面，我们曾经同时用到很多插件，如jQuery的Tab,autoComplete,validate及相关其他插件，这样插件相关的文件就很多很多了，随着开发的进行,越难越管理，而且jQuery也在不断的升级，不同的插件还会出现版本的问题.随着这些问题的出现,急需一个配置文件来配置管理.

一.定义jQuery资源配置文件

以下为我定义的基本格式

  1. <?xml version="1.0" encoding="utf-8"?> 
  2. <Resources> 
  3.     <Common> 
  4.       <Plugins> 
  5.         <Plugin Name="cookie" Src="~/App_Scripts/jPlugin/cookie/cookie.pack.js"> 
  6.           <Styles> 
  7.           </Styles> 
  8.           <Scripts> 
  9.             <Script Key="jquery" Src="~/App_Scripts/jquery.js" /> 
  10.           </Scripts> 
  11.         </Plugin> 
  12.         <Plugin Name="treeview" Src="~/App_Scripts/jPlugin/jquery-treeview/jquery.treeview.pack.js"> 
  13.           <Styles> 
  14.             <Style Key="jquery_treeview_css" Href="~/App_Scripts/jPlugin/jquery-treeview/jquery.treeview.css" /> 
  15.           </Styles> 
  16.           <Scripts> 
  17.             <Script Key="jquery" Src="~/App_Scripts/jquery.js" /> 
  18.           </Scripts> 
  19.         </Plugin> 
  20.         <Plugin Name="autocomplete" Src="~/App_Scripts/jPlugin/jquery-autocomplete/jquery.autocomplete-bundle.pack.js"> 
  21.           <Styles> 
  22.             <Style Key="autocomplete_css" Href="~/App_Scripts/jPlugin/jquery-autocomplete/jquery.autocomplete.css" /> 
  23.           </Styles> 
  24.           <Scripts> 
  25.             <Script Key="jquery" Src="~/App_Scripts/jquery.js" /> 
  26.             <Script Key="bgiframe" Src="~/App_Scripts/jPlugin/jquery-bgiframe/jquery.bgiframe.min.js" /> 
  27.           </Scripts> 
  28.         </Plugin> 
  29.       </Plugins> 
  30.     </Common> 
  31.     <Required> 
  32.         <Scripts> 
  33.           <Script Name="jdMenu"></Script> 
  34.             <Script Name="hint"></Script> 
  35.             <Script Name="jQueryCustomExt"></Script> 
  36.             <Script Name="cookie"></Script> 
  37.         </Scripts> 
  38.     </Required> 
  39.     <Pages> 
  40.         <Page Src="~/Administration/EmployeeMgmt.aspx"> 
  41.             <Scripts> 
  42.                 <Script Name="jTemplates"></Script> 
  43.                 <Script Name="treeview"></Script> 
  44.                 <Script Name="scrollTo"></Script> 
  45.                 <Script Name="validate"></Script> 
  46.                 <Script Name="jQueryCustomExt"></Script> 
  47.                 <Script Name="autocomplete"></Script> 
  48.                 <Script Name="blockUI"></Script> 
  49.             </Scripts> 
  50.         </Page> 
  51.         <Page Src="~/ScheduleMgmt/Reschedule.aspx"> 
  52.             <Scripts> 
  53.                 <Script Name="My97DatePicker"></Script> 
  54.                 <Script Name="jQueryCustomExt"></Script> 
  55.                 <Script Name="draggable_1.0"></Script> 
  56.                 <Script Name="jTemplates"></Script> 
  57.                 <Script Name="tab_1.0"></Script> 
  58.                 <Script Name="autocomplete"></Script> 
  59.                 <Script Name="spinBtn"></Script> 
  60.                 <Script Name="hotkeys"></Script> 
  61.                 <Script Name="datepicker"></Script> 
  62.                 <Script Name="clockpick"></Script> 
  63.                 <Script Name="validate"></Script> 
  64.                 <Script Name="blockUI"></Script> 
  65.                 <Script Name="tooltip"></Script> 
  66.                 <Script Name="contextmenu"></Script> 
  67.                 <Script Name="hint"></Script> 
  68.                 <Script Name="jqueryMultiSelect"></Script> 
  69.                 <Script Name="timePicker"></Script> 
  70.             </Scripts> 
  71.         </Page> 
  72.     </Pages> 
  73. </Resources> 

1.Plugins节点表示每个不同的jQuery插件,Styles和Scripts节点是css文件和js文件集合，即这个jQuery插件的依赖文件.每个文件都有一个key，为了保证文件不重复加载.

2.再看Required节点,Required其实全局js加载,如每张页面都需要菜单，则需要jdMenu插件.这个可以根据需求来调整.

3.Pages节点.

这个节点集合是配置每个具体页面需要用到的插件.

以上三点为基本点，当然每个系统还有其他要注意的，比如有些页面的功能需要有权限的人才能使用，那如果没有权限的人员进入，则与此功能相关的插件则无需加载.具体可以根据需求不同进行扩展.

二.解析资源文件

以上文件可以利用asp.net 2.0的文件依赖缓存在服务器端缓存起来，然后进行解析.我这里代码可能写的比较乱，并不完善.给大家一个参考吧.

  1. using System;  
  2. using System.Collections.Generic;  
  3. using System.Linq;  
  4. using System.Text;  
  5. using System.Web.UI;  
  6. using System.Xml;  
  7. using System.Web;  
  8. using System.Web.Caching;  
  9.  
  10. namespace Luna.Common  
  11. {  
  12.    public class SiteConfig  
  13.     {  
  14.         public static XmlDocument GetResourceXml()  
  15.         {  
  16.             XmlDocument doc = new XmlDocument();  
  17.             ContentCache contentCache = ContentCache.Instantiate();  
  18.  
  19.  
  20.  
  21.             if (contentCache["ResourceMulit"] != null)  
  22.             {  
  23.                 doc = (XmlDocument)contentCache["ResourceMulit"];  
  24.             }  
  25.             else  
  26.             {  
  27.                 string file = HttpContext.Current.Server.MapPath("/App_Data/ResourceMulit.xml");  
  28.                 doc.Load(file);  
  29.                 CacheDependency dep = new CacheDependency(file, DateTime.Now);  
  30.                 contentCache.Insert("ResourceMulit", doc, dep);  
  31.             }  
  32.             return doc;  
  33.         }  
  34.  
  35.         public static void RegsiterResource()  
  36.         {  
  37.             XmlDocument doc = SiteConfig.GetResourceXml();  
  38.  
  39.             XmlNode firstNode = doc.DocumentElement.FirstChild;  
  40.             XmlNodeList RequiredScripts = firstNode.FirstChild.ChildNodes;  
  41.             XmlNodeList RequiredStyles = firstNode.ChildNodes[1].ChildNodes;  
  42.  
  43.             Page currentPage = (Page)HttpContext.Current.Handler;  
  44.             RegisterResource(RequiredScripts, RequiredStyles);  
  45.  
  46.             XmlNode secondNode = doc.DocumentElement.ChildNodes[1];  
  47.             foreach (XmlNode item in secondNode.ChildNodes)  
  48.             {  
  49.                   
  50.                 string pageSrc = item.Attributes["Src"].Value.ToLower();  
  51.                 if (currentPage.ResolveUrl(pageSrc) == HttpContext.Current.Request.Path.ToLower())  
  52.                 {  
  53.                     RegisterResource(item.FirstChild.ChildNodes, item.ChildNodes[1].ChildNodes);  
  54.                 }  
  55.             }  
  56.         }  
  57.  
  58.  
  59.         public static void RegsiterResourceKey(XmlNode node, List<string> resourceNode, List<string> removeNode)  
  60.         {  
  61.             if (node != null)  
  62.             {  
  63.                 XmlNode scriptsNodes = node.SelectSingleNode("descendant::Scripts");  
  64.  
  65.                 foreach (XmlNode scriptNode in scriptsNodes.ChildNodes)  
  66.                 {  
  67.                     if (scriptNode.Attributes["Removed"] == null)  
  68.                     {  
  69.                         resourceNode.Add(scriptNode.Attributes["Name"].Value);  
  70.                     }  
  71.                     else  
  72.                     {  
  73.                         removeNode.Add(scriptNode.Attributes["Name"].Value);  
  74.                     }  
  75.  
  76.                 }  
  77.             }  
  78.         }  
  79.  
  80.         public static void RegsiterCommon()  
  81.         {  
  82.             XmlDocument doc = SiteConfig.GetResourceXml();  
  83.  
  84.  
  85.             //XmlNodeList RequiredStyles = firstNode.ChildNodes[1].ChildNodes;  
  86.             List<Plugin> PluginList = RegsiterCommonResource(doc);  
  87.  
  88.             //RegisterResource(RequiredScripts, RequiredStyles);  
  89.             //Pages  
  90.  
  91.  
  92.             XmlNode currentPageNode = GetCurrentPageNode(doc);  
  93.             XmlNode RequireNode = GetRequireNode(doc);  
  94.             Dictionary<string, string> scriptList = new Dictionary<string, string>();  
  95.             Dictionary<string, string> styleList = new Dictionary<string, string>();  
  96.  
  97.             List<string> removeNode = new List<string>();  
  98.             List<string> resourceNode = new List<string>();  
  99.             if (currentPageNode != null)  
  100.             {  
  101.                 XmlAttribute isAuthenticated = currentPageNode.Attributes["IsAuthenticated"];  
  102.                 if (isAuthenticated != null)  
  103.                 {  
  104.  
  105.                     if (Convert.ToBoolean(isAuthenticated.Value) && HttpContext.Current.Request.IsAuthenticated)  
  106.                     {  
  107.                         RegsiterResourceKey(currentPageNode, resourceNode, removeNode);  
  108.                     }  
  109.                 }  
  110.                 else  
  111.                 {  
  112.                     RegsiterResourceKey(currentPageNode, resourceNode, removeNode);  
  113.                 }  
  114.             }  
  115.              
  116.  
  117.             RegsiterResourceKey(RequireNode, resourceNode, removeNode);  
  118.  
  119.            List<string> filterResourceNode= resourceNode.FindAll(delegate(string node)  
  120.             {  
  121.                 foreach (var item in removeNode)  
  122.                 {  
  123.                     return node != item;  
  124.                 }  
  125.                 return true;  
  126.             });  
  127.            foreach (var item in filterResourceNode)  
  128.             {  
  129.                 Plugin plugin = GetCurrentPlugin(item, PluginList);  
  130.  
  131.                 RegisterPlugin(scriptList, styleList, plugin);  
  132.             }  
  133.         }  
  134.  
  135.         public static void RegisterPlugin(Dictionary<string, string> scriptList, Dictionary<string, string> styleList, Plugin plugin)  
  136.         {  
  137.             Page currentPage = (Page)HttpContext.Current.Handler;  
  138.             foreach (Style style in plugin.Styles)  
  139.             {  
  140.                 if (!styleList.ContainsKey(style.Key))  
  141.                 {  
  142.                     styleList.Add(style.Key, style.Href);  
  143.                     currentPage.AddCss(style.Href);  
  144.                 }  
  145.             }  
  146.             foreach (Script script in plugin.Scripts)  
  147.             {  
  148.                 if (!scriptList.ContainsKey(script.Key))  
  149.                 {  
  150.                     scriptList.Add(script.Key, script.Src);  
  151.                     currentPage.AddScript(script.Src);  
  152.                 }  
  153.             }  
  154.             if (!scriptList.ContainsKey(plugin.Name))  
  155.             {  
  156.                 scriptList.Add(plugin.Name, plugin.Src);  
  157.                 currentPage.AddScript(plugin.Src);  
  158.             }  
  159.         }  
  160.  
  161.         public static Plugin GetCurrentPlugin(string scriptNode, List<Plugin> PluginList)  
  162.         {  
  163.  
  164.             foreach (Plugin plugin in PluginList)  
  165.             {  
  166.                 if (scriptNode == plugin.Name)  
  167.                 {  
  168.                     return plugin;  
  169.                 }  
  170.             }  
  171.             return PluginList[0];  
  172.         }  
  173.  
  174.         private static XmlNode GetRequireNode(XmlDocument doc)  
  175.         {  
  176.             XmlNode node = doc.DocumentElement.SelectSingleNode("descendant::Required");  
  177.             return node;  
  178.         }  
  179.  
  180.         public static XmlNode GetCurrentPageNode(XmlDocument doc)  
  181.         {  
  182.  
  183.             Page currentPage = (Page)HttpContext.Current.Handler;  
  184.             XmlNode node = doc.DocumentElement.SelectSingleNode("descendant::Pages");  
  185.             foreach (XmlNode item in node.ChildNodes)  
  186.             {  
  187.  
  188.                 string pageSrc = item.Attributes["Src"].Value.ToLower();  
  189.                 if (currentPage.ResolveUrl(pageSrc) == HttpContext.Current.Request.Path.ToLower())  
  190.                 {  
  191.                     return item;  
  192.                 }  
  193.             }  
  194.             return null;  
  195.         }  
  196.  
  197.         public static List<Plugin> RegsiterCommonResource(XmlDocument doc)  
  198.         {  
  199.             XmlNode firstNode = doc.DocumentElement.SelectSingleNode("descendant::Common");  
  200.             XmlNodeList PluginNodeList = firstNode.SelectSingleNode("descendant::Plugins").ChildNodes;  
  201.  
  202.             Page currentPage = (Page)HttpContext.Current.Handler;  
  203.             List<Plugin> plugins = new List<Plugin>();  
  204.             foreach (XmlNode item in PluginNodeList)  
  205.             {  
  206.                 Plugin plugin = new Plugin();  
  207.                 plugin.Name = item.Attributes["Name"].Value;  
  208.                 plugin.Src = currentPage.ResolveUrl(item.Attributes["Src"].Value);  
  209.                   
  210.                 XmlNodeList scripts = item.SelectSingleNode("descendant::Scripts").ChildNodes;  
  211.                 foreach (XmlNode script in scripts)  
  212.                 {  
  213.                     string key = script.Attributes["Key"].Value;  
  214.                     string src = currentPage.ResolveUrl(script.Attributes["Src"].Value);  
  215.                     bool removed = false;  
  216.                     if (script.Attributes["Removed"] != null)  
  217.                     {  
  218.                         removed = Convert.ToBoolean(script.Attributes["Removed"].Value);  
  219.                     }  
  220.                     plugin.Scripts.Add(new Script(key, src,false));  
  221.                 }  
  222.                 XmlNode styles = item.SelectSingleNode("descendant::Styles");  
  223.                   
  224.                 if (styles != null)  
  225.                 {  
  226.                     foreach (XmlNode style in styles.ChildNodes)  
  227.                     {  
  228.                         plugin.Styles.Add(new Style(style.Attributes["Key"].Value,currentPage.ResolveUrl(style.Attributes["Href"].Value)));  
  229.                     }  
  230.                 }  
  231.                 plugins.Add(plugin);  
  232.             }  
  233.             return plugins;  
  234.         }  
  235.  
  236.         private static void RegisterScript(string aa)  
  237.         {  
  238.             //foreach (XmlNode item in scriptsNode)  
  239.             //{  
  240.             //    string key = item.Attributes["Name"].Value;  
  241.  
  242.             //    RegisterScript(key);  
  243.             //}  
  244.         }  
  245.  
  246.         private static void RegisterResource(XmlNodeList scripts, XmlNodeList styles)  
  247.         {  
  248.             Page currentPage = (Page)HttpContext.Current.Handler;  
  249.             foreach (XmlNode item in styles)  
  250.             {  
  251.                 string href = currentPage.ResolveUrl(item.Attributes["Href"].Value);  
  252.                 LiteralControl control = new LiteralControl(string.Format("\n<link href=\"{0}\" rel=\"stylesheet\" type=\"text/css\" />", href));  
  253.                 currentPage.Header.Controls.Add(control);  
  254.             }  
  255.             foreach (XmlNode item in scripts)  
  256.             {  
  257.                 string key = item.Attributes["Key"].Value;  
  258.                 string src = currentPage.ResolveUrl(item.Attributes["Src"].Value);  
  259.                 currentPage.AddScript(src);  
  260.                 //currentPage.ClientScript.RegisterClientScriptInclude(currentPage.GetType(), key, src);  
  261.             }  
  262.  
  263.         }  
  264.     }  
  265. }  

三.定义一个基类Page，与实际页面进行匹配

  1. protected override void OnLoad(EventArgs e)  
  2.     {  
  3.         SiteConfig.RegsiterCommon();  
  4.     }  

好了，基本思路就是如此.大家有更好方案可以拿出来讨论下哈.

TAGs: jquery 插件

  • 上一篇：与其他库一起使用jQuery
  • 下一篇：2009年度最受欢迎jQuery插件
    • 阅读此文章的网友同时还阅读了：

    文章评论(查看全部)

    看不清楚？单击换一张。
    loading.. 评论加载中....
    推荐阅读
    热门关注
    随机文档
    关于我们 - 广告服务 - 版权隐私 - 免责声明 - RSS地图 - 网站地图 - 使用帮助 - 返回顶部

    Copyright © 2010 All Rights Reserved.京ICP备案06029069号