动态加载JS文件（支持各种浏览器）

   我是一个喜欢偷懒的程序员，什么事情都想能封装就封装，能系统自动做就自动做，所以咯，为了这个目的，最近开始写一套自己的框架。
    首先，我开始了JS框架的编写：为了让页面打开的时候，系统就自动的去填充一些数据，比如 select（获取这个select的数据，后台代码已经写好，在web容器一开始的时候就去获取数据，然后放在缓存当中，以后只要从这个缓存读取就可以了） 等，所以我开始了写这个功能
          1、我写了一个common.js文件，这里面的功能都是系统自动会去执行的方法，这个文件里面会自动的去页面查找我指定的元素，然后通过ajax去后台查我要的select数据，返回。
          2、 再写一个util.js文件，这个文件里面放着JS工具方法，当然，填充select的方法也放在这里面，写这个文件的目的是为了不单系统可以自动调用这里面的方法，也可以让开发者手动去使用这里面的方法。

        写好这些功能后，我又希望开发者只要在页面上导入 common.js就可以了，而不要再手动去导入util.js 等其他文件，所以我就必须在common.js中动态的去加载util.js文件。一开始我是这么写的: document.write("<script type='text/javascript' src='"+_webInfPath+"/js/util.js'</script>");  (变量_webInfPath是工程的web-inf路径，值也是动态获取的，这里不多解释读取方式，各人有各人的方法)。结果出问题了，加载util.js文件后，马上去执行里面的方法，结果就出错了。调试了半天不明白，上网查了下原因，才发现原来document.write这种加载JS文件的方法竟然是异步的。。也就是说，我在加载util.JS文件的时候还没加载完就去调用里面的方法，当然出错了。

      好吧，知道了出错的原因，和同事讨论了一下，想办法改成同步调用就没问题了，可是没结果，不知道怎么做。。不久之后突然灵光一闪（拖最近在用jquery的福），突然想到了，jquery的 append 这个方法，然后就把代码改成了$(document).append("<script type='text/javascript' src='"+_webInfPath+"/js/util.js'</script>"); OK，问题解决了。。
 
       哈哈，那个兴奋。。
       其实这方面的解决办法网络上也是有的（虽然查到了，但是我没有试验，太麻烦了） ，而且还存在浏览器兼容的问题。。。 我这里使用了jquery的append方法，不仅解决了异步的问题，还解决了浏览器的兼容问题，而且代码还简单。。
       呵呵。。。继续编写我自己的框架了。。
       我是一个爱偷懒的程序员。。
       再来补充一下吧，由于个人当心我的表达能力不好，看的人不明白我写什么，所以这里附上我写的部分代码来表达我的意思。。

首先HTML文件部分代码：
        <script type="text/javascript" src="./js/jquery-1.4.2.js"></script>
       <script type="text/javascript" src="./js/common.js"></script>

     <select id="ts1" jselect="ts1"></select><!-- 下拉框使用 -->

然后是common.js部分代码：
var _webInfPath = "" ;  //工程上下文web-inf路径


//初始页面
$(document).ready(function(){
_webInfPath = getWebRootPath(); //获取工程上下文路径
$(document).append("<script type='text/javascript' src='"+_webInfPath+"/js/util.js'</script>");
JSelect(); //下拉框填值
}
);

//获取项目跟路径
function getWebRootPath(){
var path = location.href ;
var pathArr = path.split("/");
return pathArr[0]+"//"+pathArr[2]+"/"+pathArr[3] ;
}

//下拉框填值
function JSelect(){
$.each($("select"),function(){
var jqueryObj = $(this) ;
var jselect = $(this).attr("jselect") ;
$.ajax({
url: _webInfPath+"/servlet/ajaxServlet.do" ,   //(这里的ajaxServlet其实是我写的一个公共的servlet，效果和struts一样，通过配置后，会自动执行action里面的方法)
data:{"method":"getJselect","act":"glob","jselect":jselect },
type: "post" ,
async : "true" ,
dataType : "json",
success : function(result){
fillSelect(result,jqueryObj.attr("id"));
}
});
});
}

然后是util.js文件的部分代码：
//-------------------------------------下拉框begin---------------------
/**
*填充下拉框供调用
*   jsonArr : 存放JselectVo对象的JOSN数组
*   selectId : selectID
*/
function fillSelect(jsonArr,selectId){
if(jsonArr==null || jsonArr.length==0){
return false ;
}
var content = "" ;
$.each(jsonArr,function(){
content += jselect_addOption(this);
});
$("#"+selectId).append(content);
}

//拼装option
function jselect_addOption(_option){
var arr = new Array() ;
arr.push("<option value='" + _option.value+"'>");
arr.push(_option.name);
arr.push("</option>");
return arr.join("");
}
//-------------------------------------下拉框end---------------------
 
写完。。


     最后的最后，补充一下，其实这也是我长久一来一直想说的：
     大家发一些心得在网络上，希望看的人是抱着一种互相学习的心态来看这些内容的，而不是去批评什么“这是垃圾，这种东西很无聊”之类的话。如果你有更好的意见，可以回帖，有需要改进的地方请提出来，你有疑问也可以问，但是请不要出现侮辱别人的词语出现。。我们都是在互相学习中前进的。。