非常简洁的动态加载js和css的jquery plugin

【 tulaoshi.com - Web开发 】

1// plugin author :　 chenjinfa@gmail.com
　2// plugin name : $.include
　3//　　　　 $.include('file/ajaxa.js');$.include('file/ajaxa.css');
　4//　 or $.includePath　 = 'file/';$.include(['ajaxa.js','ajaxa.css']);
　5
　6$.extend({
　7　　　 includePath: '',
　8　　　 include: function(file) {
　9　　　　　　　 var files = typeof file == "string" ？ [file]:file;
10　　　　　　　 for (var i = 0; i files.length; i++) {
11　　　　　　　　　　　 var name = files[i].replace(/^s|s$/g, "");
12　　　　　　　　　　　 var att = name.split('.');
13　　　　　　　　　　　 var ext = att[att.length - 1].toLowerCase();
14　　　　　　　　　　　 var isCSS = ext == "css";
15　　　　　　　　　　　 var tag = isCSS ？ "link" : "script";
16　　　　　　　　　　　 var attr = isCSS ？ " type='text/css' rel='stylesheet' " : " language='javascript' type='text/javascript' ";
17　　　　　　　　　　　 var link = (isCSS ？ "href" : "src") + "='" + $.includePath + name + "'";
18　　　　　　　　　　　 if ($(tag + "[" + link + "]").length == 0) document.write("" + tag + attr + link + "/" + tag + "");
19　　　　　　　 }
20　　　 }
21});

　　放在javascript文件头部，就像C#（using...）或Java（import ...）

　　示例：部门管理页 Department.aspx

　　注：因编辑器的问题，内容（http://www.cnblogs.com）原文是“. . / . . /”　

.
head
link rel="stylesheet" href="http://www.cnblogs.com/css/common.css" type="text/css"/
script src="http://www.cnblogs.com/javascript/jquery.js" type="text/javascript"/script
script src="http://www.cnblogs.com/javascript/common.js" type="text/javascript"/script
script src="DepartmentInfo.js" type="text/javascript"/script
/head

　　include plugin 代码 放在公共common.js。

　　DepartmentInfo.js 文件代码

$.includePath = 'http://www.cnblogs.com/javascript/';
$.include(['json2.js', 'jquery.tree.js', 'jquery.tree.css']);

$(function() {
　 $("#depTree").tree({
　　　 url: "http://www.cnblogs.com/service/ES_SYSTEM.svc/DEP_INFO_Tree"
　 });
　 .
});
.

　　这样写法挺好看的。

　　以后有空再我发表我写的整个项目及体会。基于asp.net Data Service 和 jquery的一套框架系统，名称定为：“E-Frame“，实现了基于角色权限系统等功能。