.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框架使用的第一步。。