dojo学习.docx
- 文档编号:8589010
- 上传时间:2023-01-31
- 格式:DOCX
- 页数:50
- 大小:135.67KB
dojo学习.docx
《dojo学习.docx》由会员分享,可在线阅读,更多相关《dojo学习.docx(50页珍藏版)》请在冰豆网上搜索。
dojo学习
Dojo学习笔记1.模块与包
Dojo是一个非常强大的面向对象的JavaScript的工具箱,建议读者能够去补充一下JavaScript下如何使用OO进行编程的,这对于你以后阅读DojoSource有很大的用处。
GettingStarted
1:
把Dojo加入到我们的Web程序中
1.标志
djConfig={isDebug:
false};
djConfig是Dojo里的一个全局对象,其作用就是为Dojo提供各种选项,isDebug是最常用的属性之一,设置为True以便能够在页面上直接看到调试输出,当然其中还有些属性与调试有关,这里就不罗索了
2.引用dojo的启动代码
这样你就引用了dojo的代码,并可以直接使用其中部分常用的对象,下载下来的dojo.js是压缩(removecommentsandspace)后的代码,要阅读的话,建议阅读dojo.js.uncompressed.js,dojo.js大概有127K,而未压缩前有211K,ok,为什么会这么大呢,原来其已经把部分常用的模块整合进dojo.js里,因此显得大了一点,build.txt里就说明了默认的dojo.js包含了哪些模块
3.声明你所要用到的包
dojo.require("dojo.math");
dojo.require("dojo.io.*");
dojo.require("dojo.widget.*");
你就把这些代码当成是java的import语句或C#中的using语句一样,如果你不require的话,而模块本身又没有整合在dojo.js中,是会出现脚本错误的喔
2.针对不同需求提供的预整合包
Dojo本身是由许多模块所组合而成的,但是由于用户需求的多样性,dojo针对不同的需求而提供了不同的版本,用户在下载dojo的时候就看见可以选择很多的版本,比如Ajax版和Widget版,每个版本最重要的区别就在于dojo.js文件,但是除此之外,每一个版本都是全功能的,dojo.js根据版本的不同而整合进了不同的模块
3.直接获取Dojo的最新源代码
首先你必须安装Subversion,当Subversion在你的电脑上能够正常工作后,你就可以通过如下命令下载dojo的源代码:
svncohttp:
//svn.dojotoolkit.org/dojo/trunk/
这会在你的当前目录下创建一个trunk的目录;如果你希望直接Get到当前目录,用这个命令:
svncohttp:
//svn.dojotoolkit.org/dojo/trunk/.
或者你希望Get到当前目录下的MyDir目录,用这个命令:
svncohttp:
//svn.dojotoolkit.org/dojo/trunk/MyDir
模块与包
模块
Dojo的代码被划分为逻辑单元称之为模块,这有点类似于Java中的package,除了dojo的模块能够包含类(类似于java中的classes)和简单函数
比如:
模块"dojo.html"包含了一系列的函数,比如dojo.html.getContentBox(),模块"dojo.dnd"包含了一系列的HtmlDragObject的类
注意名称约定,函数的首字母为小写字母,类的首字母为大写
模块也可以称之为"命名空间"
包
在多数情况下,dojo的模块只需要定义在一个文件就可以了,但有时,一个模块可能划分到多个文件,比如:
模块dojo.html,本来是定义在一个文件中,可是由于功能的增强,文件逐渐变大,我们不得不将其拆分为多个文件,这主要是为性能考虑,以便浏览器可以只下载其需要用到的代码,不幸的是其实现细节对于dojo的用户看起来不那么透明,你必须知道你想要用到的功能到底是包含在哪个文件,然后才能require并使用它
这样的每一个文件都称之为一个包
dojo.require("dojo.html.extras")
将引用文件src/html/extras.js,这将定义模块dojo.html的若干(并非所有)函数
据我所知,尽管单个文件可以定义包里的多个类,单个脚本文件不能定义多个模块(在Java可以等效于在一个文件中定义2个类),并且,包的名称和模块的名称可以不同,比如:
包dojo.widget.Button定义了dojo.widget.html.Button
基本上你应该这样认为,包和模块尽管密切相关,但是是两个完全不同的实体
为什么会有模块和包这样的概念?
为什么会有模块和包这样的概念?
为了满足你的应用程序只需要加载其所用到的东西的需求,充分利用模块化设计的优点,dojo维护了最小的足印以便仍能提供你所需要的功能,为什么要你的用户浪费时间去下载用不到的JavaScript,当一个包就是一个js文件时,一个模块本质上就是一个命名空间,比如:
dojo.style或dojo.html.extras
多数简单情况下,一个包包含了一个模块,但更常见的是,一个模块可能被拆分为几个包文件
利用包和模块,将能确保你能够交付最相关的功能代码,最小程度的减少代码的膨胀和消除由此带来的不好的用户体验,这就是模块设计的主要目标,通过模块化,你能够引入自定义模块(你自己拥有的JavaScript工具),并且维护模块对于核心代码库基本不会产生什么影响
另外,Dojo的模块系统也提供了内建的机制来使用代码提供命名空间,比如,通过模块dojo.event定义的Dojo的事件系统
Dojo学习笔记2.djConfig解说
djConfig是dojo内置的一个全局设置对象,其作用是可以通过其控制dojo的行为
首先我们需要在引用dojo.js前声明djConfig对象,以便在加载dojo.js的时候才能够取得所设置的值,虽然在0.3版本以后dojo支持在加载后设置,但是强烈建议你把声明djConfig的代码作为第一段script
一个完整的djConfig对象定义如下(值均为dojo的默认值)
vardjConfig={
isDebug:
false,
debugContainerId:
"",
bindEncoding:
"",
allowQueryConfig:
false,
baseScriptUri:
"",
parseWidgets:
true
searchIds:
[],
baseRelativePath:
"",
libraryScriptUri:
"",
iePreventClobber:
false,
ieClobberMinimal:
true,
preventBackButtonFix:
true,
};
isDebug是一个很有用的属性,顾名思义,如果设置为真,则所有dojo.Debug的输出有效,开发时应该设置为true,发布时应该设置为false
debugContainerId同样也是与调试有关的,如果不指定的话,调试信息将会直接利用document.write输出,这样可能会破坏页面的整体布局,所以你可以指定任何一个可以作为容器的html元素的id作为调试信息输出容器
allowQueryConfig,这个属性指明dojo是否允许从页面url的参数中读取djConfig中的相关属性,当值为true时,dojo会优先从url参数中读取djConfig的其他属性,比如:
http:
//server/dojoDemo.htm?
djConfig.debugContainerId=divDebug
baseScriptUri,一般不需要设置,dojo会自动根据你引用dojo.js的路径设置这个值,比如,
ps:
如果你有多个工程需要同时引用dojo.js的话,建议也把dojo当作一个独立的工程,引用的时候采用绝对路径就可以了
parseWidgets,这个是可以控制dojo是否自动解析具有dojoType的html元素为对应的widget,如果你没有使用任何Widget,建议设置为false以加快dojo的加载速度
searchIds,这是一个字符串数组,定义了所有需要解析为widget的html元素的ID,如果ID不在其中的html元素是不会被解析的,当数组为空数组时,则所有具有dojoType的元素都会被解析
还有一个bindEncoding,是用来设置默认的bind请求的编码方式
至于其它的属性,不是用处不大,就是不知道有什么作用
在实际开发中,可以把djConfig的定义放在一个js文件里,并将其作为第一个引用的js文件,这样应该是最方便的。
Dojo学习笔记3.Dojo的基础对象和方法
这里所说的基础对象和方法是指的不Require任何包就能够调用的对象和方法
匿名函数
在开始前,我想介绍一下js里的匿名函数,这个在阅读dojo的源代码的时候,会发现到处都有匿名函数
;(function(){
alert(123);
})();
//前面的分号是一个空语句,是可以不要的
匿名函数。
一个匿名函数就是一个没有名字的函数。
你可以认为他们是一次性函数。
当你只需要用一次某个函数时,他们就特别有用。
通过使用匿名函数,没有必要把函数一直放在内存中,所以使用匿名函数更加有效率。
当然你也可以根本不定义函数,但是使用匿名函数可以把你的代码分段,就像C#中的#region一样
dojo.byId
非常有用的一个方法,与prototype.js的著名的$一样
似乎以前的版本还有dojo.byIdArray,不过最新的版本已经找不到这个函数了(除了srccompat.2.2.js)
如果有多个元素具有指定的id,则返回的是一个集合
UsageExample:
dojo.byId("divTest");
dojo.byId("divTest",document);
dojo.byId(document.getElementById("divTest"));
dojo.version
dojo的版本,可以取得major,minor,patch,flag和revision
这个对象没什么太大用处,除非你要根据dojo的版本选择执行你的代码
dojo.raise
抛出一个异常
dojo.errorToString
将异常转换为字符串
UsageExample:
try
{
dojo.raise("打印失败",newError("文件不存在"));
}
catch(e)
{
alert(dojo.errorToString(e));
}
dojo.render
系统环境对象
dojo.render.name 返回browser,说明是工作在浏览器下
dojo.render.ver 返回4,似乎没什么用
dojo.os.win 返回true说明操作系统是Windows
dojo.os.linux 返回true说明操作系统是Linux
dojo.os.osx 返回true说明操作系统是MacOS
dojo.html.ie 返回true说明浏览器是InternetExplorer
dojo.html.opera 返回true说明浏览器是Opera
dojo.html.khtml 返回true说明浏览器是Konqueror
dojo.html.safari 返回true说明浏览器是Safari
dojo.html.moz 返回true说明浏览器是MozillaFireFox
dojo.svg.capable 返回true说明浏览器支持svg
dojo.vml.capable 返回true说明浏览器支持vml
dojo.swf.capable 返回true说明浏览器支持swf
dojo.swt.capable 返回true说明浏览器支持swt(IBM开发的StandardWidgetToolkit)
如果dojo.html.ie为true的话
dojo.html.ie50 返回true说明浏览器是IE5.0
dojo.html.ie55 返回true说明浏览器是IE5.5
dojo.html.ie60 返回true说明浏览器是IE6.0
dojo.html.ie70 返回true说明浏览器是IE7.0
dojo.addOnLoad
可以加载指定函数到window.load时执行,好处就是可以很方便的在window.load时执行多个函数
UsageExample:
dojo.addOnLoad(init); //init是一个函数
dojo.addOnLoad(myObject,init); //init是myObject对象的一个方法
dojo.require
如果你想调用一个模块的对象的时候,你应该首先用dojo.require来请求这个模块,dojo会根据你的请求自动取得相应的js文件,并加载到内存中,这样你才能调用或创建其中的对象
dojo会自动维护已加载的模块列表,所以是不会重复加载模块的
UsageExample:
dojo.require("dojo.event");
dojo.requireIf=dojo.requireAfterIf
可以根据指定的条件来决定是否加载指定的模块
UsageExample:
dojo.requireIf(dojo.html.ie,"dojo.html"); //如果dojo.html.ie为true,才会加载dojo.html模块
dojo.provide
除非你要开发自己的模块,不然是用不到这个方法的,你可以这句看成是向系统注册这个模块名称
UsageExample:
dojo.provide("dojo.custom");
dojo.exists
判断指定对象是否具有指定名称的方法
UsageExample:
dojo.exists(dojo,"exists");//willreturntrue
dojo.hostenv.getText
返回指定url的内容
PS:
由于浏览器的安全限制,因此只能用于取得同域名的url的内容,否则会报告权限不够
UsageExample:
aSync=false;//同步,确保返回内容不为null
silent=true;//不抛出错误
s=dojo.hostenv.getText("aSync,silent);//返回Google的首页的HTML
alert(s);
dojo.debug
输出调试信息,如果在djConfig中指定了debugContainerId,则输出到指定的console容器中,否则直接document.write
所有的调试信息均以DEBUG:
开头
UsageExample:
dojo.debug("这是调试信息");
dojo.hostenv.println
与dojo.debug类似,不同的是,输出内容没有DEBUG:
UsageExample:
dojo.hostenv.println("这是一般的输出信息");
dojo.debugShallow
输出指定对象的全部信息(Shallow说明并不会遍历到下一级别的对象属性)以供调试
UsageExample:
dojo.debugShallow(dojo.render.html);
以上全部是自己阅读源代码写的总结,如有错误,还请指明。
Dojo学习笔记4.dojo.string&dojo.lang
模块:
mon/dojo.string
mon和dojo.string是一样的,只要require其中一个就可以使用以下方法
dojo.string.trim
去掉字符串的空白
UsageExample:
s="abc";dojo.string.trim(s); //willreturn"abc"dojo.string.trim(s,0); //willreturn"abc"dojo.string.trim(s,1); //willreturn"abc"dojo.string.trim(s,-1); //willreturn"abc"
dojo.string.trimStart
去掉字符串开头的空白
UsageExample:
s="abc";dojo.string.trimStart(s); //willreturn"abc"
dojo.string.trimEnd
去掉字符串结尾的空白
UsageExample:
s="abc";dojo.string.trimEnd(s); //willreturn"abc"
dojo.string.repeat
生成由同一字符(串)重复组成的字符串
UsageExample:
dojo.string.repeat("a",4); //willreturn"aaaa"dojo.string.repeat("1234",3,"-"); //willreturn"1234-1234-1234"
dojo.string.pad
使用字符补齐字符串
UsageExample:
dojo.string.pad("100",6); //willreturn"000100"dojo.string.pad("100",6,"0",1); //willreturn"000100"dojo.string.pad("100",6,"0",-1); //willreturn"100000"
dojo.string.padLeft
使用字符补齐字符串开头
UsageExample:
dojo.string.padLeft("100",6); //willreturn"000100"
dojo.string.padRight
使用字符补齐字符串结尾
UsageExample:
dojo.string.padRight("100",6); //willreturn"100000"
模块:
mon/dojo.lang
mon和dojo.lang是一样的,只要require其中一个就可以使用以下方法
dojo.lang.mixin
将一个对象的方法和属性增加到另一个对象上
UsageExample:
vars1={name:
"TestObj",test1:
function(){alert("thisistest1!
");}}vars2={value:
1000,test2:
function(){alert("thisistest2!
");}}vard={};dojo.lang.mixin(d,s1,s2); //执行后d就具备了s1和s2的所有属性和方法d.test1();
dojo.lang.extend
为指定类的原型扩展方法与属性
UsageExample:
TestClass=function(){};dojo.lang.extend(TestClass,{name:
"demo",test:
function(){alert("Test!
");}});varo=newTestClass(); //TestClass本来是没有test方法的,但是extend以后就有test方法了o.test();
dojo.lang.find=dojo.lang.indexOf
查找指定对象在指定数组中的位置
UsageExample:
vararr=[1,2,3,3,2,1];dojo.lang.find(arr,2); //willreturn1dojo.lang.find(arr,2,true); //willreturn1dojo.lang.find(arr,"2",true); //willreturn-1dojo.lang.find(arr,"2",false); //willreturn1dojo.lang.find(arr,2,true,true); //willreturn4
dojo.lang.findLast=dojo.lang.lastIndexOf
查找指定对象在指定数组中的位置,从后往前查
UsageExample:
vararr=[1,2,3,3,2,1];dojo.lang.findLast(arr,2); //willreturn4dojo.lang.findLast(arr,2,true); //willreturn4dojo.lang.findLast(arr,"2",true); //willreturn-1dojo.lang.findLast(arr,"2",false); //willreturn4
dojo.lang.inArray
查找指定对象是否在指定数组中
UsageExample:
vararr=[1,2,3];dojo.lang.inArray(arr,1); //willreturntruedojo.lang.inArray(arr,4); //willreturnfalse
dojo.lang.isObject
判断输入的类型是否为对象
UsageExample:
dojo.lang.isObject(newString()); //willreturntruedojo.lang.isObject("123")); //willreturnfalse
dojo.lang.isArray
判断输入的类型是否为数组
UsageExample:
dojo.lang.isArray({a:
1,b:
2}); //willreturnfalsedojo.lang.isArray([1,2,3]); //willreturntrue
dojo.lang.isFunction
判断输入的类型是否为函数
UsageExample:
dojo.lang.isFunction(function()
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- dojo 学习