首页 诗词 字典 板报 句子 名言 友答 励志 学校 网站地图
当前位置: 首页 > 教程频道 > 网站开发 > Web前端 >

.DWZ源代码分析1-框架通道口

2012-08-09 
.DWZ源代码分析1--框架入口..纠结了一个星期终于整明白了..分析的时候使用我编写的 JFunctionFinder 工具

.DWZ源代码分析1--框架入口
   ..纠结了一个星期终于整明白了..  分析的时候使用我编写的 JFunctionFinder 工具检索,,关键字,分析的确挺方便的..这个在上篇有源代码... DWZ框架的入口这个框架核心在  dwz.core.js的文件下,它包含了 贯穿整个DWZ框架的核心方法 如  页面初始化 init和 表单提交ajax等还有包括一些页面加载配置等信息,我们就没必要去逐个分析了,知道如何使用就可以了。这里主要介绍init函数DWZ小组在这个js页面下创建了一个 名字为DWZ的对象.这个对象是一个键值对数组.javascript的一种对象表示形式,,比如上面的init方法.在DWZ中的定义就类似如下 、var  DWZ={
inti:function(){,,,,,核心代码 } ,ajax:function(){ ajax代码....}};不熟悉javascript的人可能觉得这是个什么玩意,其实这是定义了一个数组,数组内部包含着键值对数组,数组每个元素的键就代表函数的名字, 因为数组也是对象所以我们看到 在 DWZ提供给我们的jui 中的index.html头部包含这样一段代码: <script type="text/javascript">
/*
 *  */
$(function(){
 DWZ.init("dwz.frag.xml",
           /////json对象
            {
  loginUrl:"login_dialog.html", loginTitle:"登录", // 弹出登录对话框
//  loginUrl:"login.html", // 跳到登录页面
  statusCode:{ok:200, error:300, timeout:301}, //【可选】
  pageInfo:{pageNum:"pageNum", numPerPage:"numPerPage", orderField:"orderField", orderDirection:"orderDirection"}, //【可选】
  debug:false, // 调试模式 【true|false】
  callback:function(){
   initEnv();
   $("#themeList").theme({themeBase:"themes"}); // themeBase 相对于index页面的主题base路径
  }
  });  
 });
</script>  我们发现他调用了 DWZ.init这个函数....这个初始化函数就是我们刚刚所说的.. 他完整的定义如下:(我添加了注释)    /////////////////////////////////////////////////////////////DWZ的入口javascript 函数  init ////////////////////////////////////////////////////
 init:function(pageFrag, options){
  var op = $.extend(options);  //在jQuery.extend进行合并 ....增加一些属性方法 并且返回options对象
  this._set.loginUrl = op.loginUrl;  //登陆url
  this._set.loginTitle = op.loginTitle; //login title
  this._set.debug = op.debug;  //是否调试
  $.extend(DWZ.pageInfo, op.pageInfo); ///整合信息到DWZ中 的 pageInfo中 因为这个键已经定义,,他会覆盖并添加 pageInfo这事 jQuery/的 extend扩展
 
                //调用jQuery的ajax提交 异步 xml 和 javascript  这里加载的是xml文件 .....
               //通过ajax请求远程xml文件
  jQuery.ajax({
   type:'GET',    //get请求
   url:pageFrag,    //请求url
   dataType:'xml',   //请求类型
   timeout: 50000,   //时间间隔
   cache: false,            //是否缓存
   error: function(xhr){             //错误 处理函数
    alert('Error loading XML document: ' + pageFrag + "\nHttp status: " + xhr.status + " " + xhr.statusText);
   }, 
   success: function(xml){               //成功处理函数.ajax成功会返回html代码..
    $(xml).find("_PAGE_").each(function(){   //搜索每个_PAGE_元素  each遍历元素集合
     var pageId = $(this).attr("id");  //获取每个xml元素的ID
     if (pageId) DWZ.frag[pageId] = $(this).text();  //增加xml中的每个元素的内容到..frag 数组中...这个在DWZ空间中已经定义
    });
    
    $(xml).find("_MSG_").each(function(){      //同上MSG  代表的是弹出框提示的消息
     var id = $(this).attr("id");   //返回当前元素ID
     if (id) DWZ._msg[id] = $(this).text();      //增加内容到DWZ._msg 数组..DWZ空间应定义
    });
    
    if (jQuery.isFunction(op.callback)) op.callback();   //panduancallback是否是函数  如果是执行callback ...op是我们传递进来的
                                                                                    /*
                                                                                         这是html初始化内容       
                                                                                       callback:function(){
                                                                             initEnv();
                                                              $("#themeList").theme({themeBase:"themes"}); // themeBase 相对于index页面的主题base路径
                                                                                     }   */
   }
  });
 }
};所以说我们在使用DWZ框架的时候一定要注意,添加初始化函数init...这是DWZ框架声明周期的起点.....我么在使用DWZ框架前必须要做的是 利用script标签导入所需要的js库.并且在随后的<scipr></script>中增加初始化init方法//////这样我们才开始了DWZ框架使用的第一步。。 

热点排行