大佬教程收集整理的这篇文章主要介绍了Dojo学习笔记,大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
Intro:
Dojo是
一个非常强大的面向对象的JavaScript的工具箱,建议读者能够去补充一下JavaScript下如何使用OO进行编程的,这对于你以后阅读Dojo
source有很大的用处
请大家下载dojo 0.3.1,以下的说明均针
对此版本
翻译自
http://manual.dojotoolkit.org/WikiHome/DojoDotBook/BookUsingDojo
Get
Ting Started
1: 把Dojo加入到我们的Web程序中
1. 标志
<script type="text/javascript">
djCon
fig =
{ isDebug:
false };
</script>
djCon
fig是Dojo里的
一个全局对象,其作用就是为Dojo提供各种选项,isDebug是最常用的
属性之一,设置为True以
便能够在
页面上直接看到调试
输出,当然其中还有些
属性与调试有关,这里就不罗索了
2. 引用 dojo 的启动
代码
<script type="text/javascript" src="/yourpath/dojo.js" />
这样你就引用了dojo的
代码,并可以直接使用其中部分常用的对象,下载下来的dojo.js是压缩(remove comments and spac
E)后的
代码,要阅读的话,建议阅读dojo.j
S.Uncompressed.js,dojo.js大概有127K,而未压缩前有211K,ok,为什么会这么大呢,原来其已经把部分常用的模块整合进dojo.js里,因此显得大了一点,build.txt里就说明了
默认的dojo.js包含了哪些模块
3. 声明你所要用到的包
<script type="text/javascript">
dojo.
require("dojo.math"
);
dojo.
require("dojo.io.*"
);
dojo.
require("dojo.widget.*"
);
</script>
你就把这些
代码当成是java的import语句或C#中的using语句一样,如果你不
require的话,而模块本身又没有整合在dojo.js中,是
会出现脚本
错误的喔
2. 针对不同需求提供的预整合包
Dojo本身是由许多模块所组合而成的,但是由于
用户需求的多样性,dojo针对不同的需求而提供了不同的版本,
用户在下载dojo的时候就看见可以选择很多的版本,比如Ajax版和Widget版,每个版本最重要的区别就在于dojo.js
文件,但是除此之外,每
一个版本都是全
功能的,dojo.js根据版本的不同而整合进了不同的模块
3. 直接@L_
262_20@Dojo的最新源
代码
首先你必须安装 Subversion,当Subversion在
你的电脑上能够正常工作后,你就可以通过如下命令下载dojo的源
代码:
svn co
http://svn.dojotoolkit.org/dojo/trunk/
这会在
你的当前目录下创建
一个 trunk 的目录; 如果你希望直接Get到当前目录,
用这个命令:
svn co
http://svn.dojotoolkit.org/dojo/trunk/ .
或者你希望Get
到当前目录下的 MyDir 目录,
用这个命令:
svn co
http://svn.dojotoolkit.org/dojo/trunk/ MyDir
模块与包
模块
Dojo的
代码被划分为逻辑单元称之为模块,这有点类似于Java中的package,除了dojo的模块能够包含类 (类似于java中的classes)和简单
函数
比如: 模块"dojo.html"包含了一系列的
函数,比如dojo.htm
l.getContent
Box(),模块"dojo.dnd"包含了一系列的HtmlDragOb
ject的类
注意@L_
673_31@约定,
函数的首字母为小写字母,类的首字母为大写
模块也可以称之为"命名空间"
包
在多数情况下,dojo的模块只需要定义在
一个文件就可以了,
但有时,
一个模块可能划分到多个
文件,比如: 模块dojo.html,
本来是定义在
一个文件中,可是由于
功能的增强,
文件逐渐变大,我们不得不将其拆分为多个
文件,这主要是为@L_
874_42@
考虑,以
便浏览器可以只下载其
需要用到的
代码,不幸的是其实现细节对于dojo的
用户看起来不那么透明,你必须知道你想要用到的
功能到底是包含在哪个
文件,然后才能
require并使用它
这样的每
一个文件都称之为
一个包
dojo.
require("dojo.htm
l.extras")
将引用
文件 src/html/extra
s.js,这将定义模块 dojo.html 的若干(并非所有)
函数
据我所知,尽管单个
文件可以定义包里的多个类,单个脚本
文件不能定义多个模块 (在Java可以等效于在
一个文件中定义2个类),并且,包的@L_
673_31@和模块的@L_
673_31@可以不同,比如: 包dojo.widget
.button定义了dojo.widget.html
.button
基本上你应该这样认为,包和模块尽管密切相关,但是是两个完全不同的实体
为什么会有模块和包这样的概念?
为什么会有模块和包这样的概念? 为了满足
你的应用程序只需要加载其所用到的东西的需求,充分利用模块化设计的优点,dojo维护了最小的足印以
便仍能提供你所需要的
功能,为什么要
你的用户浪费时间去下载用不到的JavaScript,当
一个包就是
一个js
文件时,
一个模块本质上就是
一个命名空间,比如: dojo.style 或 dojo.htm
l.extras
多数简单情况下,
一个包包含了
一个模块,但更常见的是,
一个模块可能被拆分为几个包
文件
利用包和模块,将能确保你能够交付最相关的
功能代码,最小程度的减少
代码的膨胀和消除由此带来的不好的
用户体验,这就是模块设计的主要目标,通过模块化,你能够引入
自定义模块(你自己拥有的 JavaScript 工具),并且维护模块对于核心
代码库基本不会产生什么影响
另外,Dojo的模块系统也提供了内建的机制来使用
代码提供命名空间,比如,通过模块dojo.event定义的Dojo的事件系统
怎样引用
设置引用语句
你怎样才能知道该引用哪个包到dojo.
require()?
1. 模块
首先,确定你要使用什么模块,这个例子我们假定你要使用 dojo.lfx.html
2. 包
搜索代码后你发现dojo.lfx.html定义在2个
文件:
src/lfx/htm
l.js
src/lfx/extra
s.js
根据你要用到的
功能,你可以
dojo.
require("dojo.lfx.html"
);
或
dojo.
require("dojo.lfx.html"
);
dojo.
require("dojo.lfx.extras"
);
通配符
新用户可能会对dojo.lfx.*这样就可以替代上面2句而感到诧异,实际上,__package__.js 中已经定义了
通配符可以代替的语句,并且这样可以让dojo根据当时的环境而决定加载具体的模块
Dojo学习笔记(2. djCon
fig解说)
djCon
fig是dojo内置的
一个全局设置对象,
其作用是可以通过其控制dojo的行为
首先我们需要在引用dojo.js前声明djCon
fig对象,以
便在加载dojo.js的时候才能够取得所设置的值,
虽然在0.3版本以后dojo
支持在加载后设置,但是强烈建议你把声明djCon
fig的
代码作为第一段script
一个完整的djCon
fig对象定义如下(值均为dojo的
默认值)
<script type="text/javascript">
var djCon
fig =
{
isDebug:
false,
debugContainerId: "",
bindEncoding: "",
allowQueryCon
fig:
false,
baseScriptUri: "",
parseWidgets: true
searchIds: [],
baseRelativePath: "",
libraryScriptUri: "",
iePreventClobber:
false,
ieClobberMinimal: true,
prevent
BACkButtonFix: true,
};
</script>
isDebug是
一个很有用的属性,
顾名思义,如果设置为真,则所有dojo.Debug的
输出有效,开发时应该设置为true,发布时应该设置为
false
debugContainerId同样也是与调试有关的,如果不指定的话,调试信息将会直接利用 document.write
输出,这样可能会破坏
页面的整体布局,所以
你可以指定任何
一个可以作为容器的html元素的id作为调试信息
输出容器
allowQueryCon
fig,这个
属性指明 dojo是否允许从
页面url的参数中读取djCon
fig中的相关
属性,当值为true时,dojo会优先从url参数中读取djCon
fig的其他
属性,比如:
http://server/dojoDemo.htm?djConfig.debugContainerId=divDebug
baseScriptUri,一般不需要设置,dojo会
自动根据你引用dojo.js的路径设置这个值,比如,<script type="text/javascript" src="../dojo/dojo.js"></script>,
自动@L_
262_20@的值
便是 ../dojo/
ps: 如果你有多个工程需要同时引用dojo.js的话,建议也把dojo当作
一个独立的工程,引用的时候采用
绝对路径就可以了
parseWidgets,这个是可以控制dojo是否
自动解析具有dojoType的html元素为对应的widget,如果你没有使用任何Widget,建议设置为
false以加快dojo的加载速度
searchIds,这是
一个字符串数组,定义了所有需要解析为widget的html元素的ID,如果ID不在其中的html元素是不会被解析的,当数组为空数组时,则所有具有dojoType的元素都会被解析
还有
一个bindEncoding,是用来设置
默认的bind请求的编码方式
至于其它的
属性,不是用处不大,就是不知道有什么作用
在实际开发中,可以把djCon
fig的定义放在
一个js
文件里,并将其作为第
一个引用的js
文件,这样应该是最方
便的。
Dojo学习笔记(3. Dojo的基础对象和
方法)
这里所说的基础对象和
方法是指的不
require任何包就能够
调用的对象和
方法
匿名
函数
在开始前,我想介绍一下js里的匿名
函数,这个在阅读dojo的源
代码的时候,会发现到处都有匿名
函数
;(function()
{
alert(123
);
})(
);
//前面的分号是
一个空语句,是可以不要的
匿名
函数。
一个匿名
函数就是
一个没有名字的
函数。
你可以认为他们是一次性
函数。当你只
需要用一次某个
函数时,他们就特别有用。
通过使用匿名
函数,没有必要把
函数一直放在内存中,所以使用匿名
函数更加有效率。
当然你也可以根本不定义
函数,但是使用匿名
函数可以把
你的代码分段,就像C#中的#region一样
dojo
.byId
非常有用的
一个方法,与prototype.js的著名的$一样
似乎以前的版本还有dojo
.byIdArray,不过最新的版本已经找不到这个
函数了(除了src/compat/0.2.2.js)
如果有多个元素具有指定的id,则返回的是
一个集合
Usage Example:
dojo
.byId("divTest"
);
dojo
.byId("divTest",document
);
dojo
.byId(document.getElementById("divTest")
);
dojo.version
dojo的版本,可以取得major,minor,patch,flag和revision
这个对象没什么太大用处,除非你要根据dojo的版本选择执行
你的代码
dojo.raise
抛出
一个异常
dojo.errorTo
String
将异常转换为字符串
Usage Example:
try
{
dojo.raise("打印失败",new Error("
文件不存在")
);
}
catch(
E)
{
alert(dojo.errorTo
String(
E));
}
dojo.render
系统环境对象
dojo.render.name 返回 browser ,说明是工作在浏览器下
dojo.render.ver 返回 4 ,似乎没什么用
doj
o.os.win 返回true说明操作系统是Windows
doj
o.os.linux 返回true说明操作系统是Linux
doj
o.os.osx 返回true说明操作系统是MacOS
dojo.htm
l.ie 返回true说明浏览器是Internet Explorer
dojo.html
.opera 返回true说明浏览器是Opera
dojo.htm
l.khtml 返回true说明浏览器是Konqueror
dojo.htm
l.safari 返回true说明浏览器是Safari
dojo.htm
l.moz 返回true说明浏览器是Mozilla FireFox
dojo.svg.capable 返回true说明浏览器
支持svg
dojo.vm
l.capable 返回true说明浏览器
支持vml
dojo.swf.capable 返回true说明浏览器
支持swf
dojo.swt.capable 返回true说明浏览器
支持swt (IBM开发的Standard Widget Toolkit)
如果dojo.htm
l.ie为true的话
dojo.htm
l.ie50 返回true说明浏览器是IE 5.0
dojo.htm
l.ie55 返回true说明浏览器是IE 5.5
dojo.htm
l.ie60 返回true说明浏览器是IE 6.0
dojo.htm
l.ie70 返回true说明浏览器是IE 7.0
dojo.addOnLoad
可以加载指定
函数到window.load时执行,好处就是可以很方
便的在window.load时执行多个
函数
Usage Example:
dojo.addOnLoad(init
); //init是
一个函数
dojo.addOnLoad(myOb
ject,init
); //init是myOb
ject对象的
一个方法
dojo.
require
如果你想
调用一个模块的对象的时候,你应该首先用dojo.
require来请求这个模块,dojo会根据
你的请求
自动取得
相应的js
文件,并加载到内存中,这样你才能
调用或创建其中的对象
dojo会
自动维护已加载的模块列表,所以是不会重复加载模块的
Usage Example:
dojo.
require("dojo.event"
);
dojo.
requireIf=dojo.
requireAfterIf
可以根据指定的条件来决定是否加载指定的模块
Usage Example:
dojo.
requireIf(dojo.htm
l.ie,"dojo.html"
); //如果dojo.htm
l.ie为true,才会加载dojo.html模块
dojo.provide
除非你要开发自己的模块,不然是用不到这个
方法的,你可以这句看成是向系统
注册这个模块@L_
673_31@
Usage Example:
dojo.provide("dojo.custom"
);
dojo.exists
判断指定对象是否具有指定@L_
673_31@的
方法
Usage Example:
dojo.exists(dojo,"exists"
); //will return true
dojo.hostenv.getText
返回指定url的
内容
PS: 由于浏览器的安全限制,
因此只能用于取得同域名的url的
内容,否则会报告权限不够
Usage Example:
aSync =
false; //同步,确保返回
内容不为null
silent = true; //不抛出
错误
s = dojo.hostenv.getText("
http://www.google.com/",aSync,silent
); //返回Google的
首页的HTML
alert(s
);
dojo.debug
输出调试信息,如果在djCon
fig中指定了debugContainerId,则
输出到指定的console容器中,否则直接document.write
所有的调试信息均以 DEBUG: 开头
Usage Example:
dojo.debug("这是调试信息"
);
dojo.hostenv.println
与dojo.debug类似,不同的是,
输出内容没有 DEBUG:
Usage Example:
dojo.hostenv.println("这是
一般的输出信息"
);
dojo.debugShallow
输出指定对象的全部信息(Shallow说明并不会遍历到下一级别的对象
属性)以供调试
Usage Example:
dojo.debugShallow(dojo.render.html
);
Dojo学习笔记(4. dojo.
String & dojo.lang)
模块:dojo.
String.common / dojo.
String
dojo.
String.common 和 dojo.
String 是一样的,只要
require其中
一个就可以使用以下
方法dojo.
String.trim去掉字符串的空白Usage Example:s = " abc ";dojo.
String.trim(s
); //will return "abc"dojo.
String.trim(s,0
); //will return "abc"dojo.
String.trim(s,1
); //will return "abc "dojo.
String.trim(s,-1
);//will return " abc"
dojo.
String.trimStart去掉字符串开头的空白Usage Example:s = " abc ";dojo.
String.trimStart(s
); //will return "abc "
dojo.
String.trimEnd去掉字符串结尾的空白Usage Example:s = " abc ";dojo.
String.trimEnd(s
); //will return " abc"
dojo.
String.repeat
生成由同一字符(串)重复组成的字符串Usage Example:dojo.
String.repeat("a",4
); //will return "aaaa"dojo.
String.repeat("1234",3,"-"
); //will return "1234-1234-1234"
dojo.
String.pad使用字符补齐字符串Usage Example:dojo.
String.pad("100",6
); //will return "000100"dojo.
String.pad("100",6,"0",1
); //will return "000100"dojo.
String.pad("100",-1
); //will return "100000"
dojo.
String.padLeft使用字符补齐字符串开头Usage Example:dojo.
String.padLeft("100",6
); //will return "000100"
dojo.
String.padRight使用字符补齐字符串结尾Usage Example:dojo.
String.padRight("100",6
); //will return "100000"
模块:dojo.lang.common / dojo.lang
dojo.lang.common 和 dojo.lang 是一样的,只要require其中一个就可以使用以下方法
dojo.lang.mixin将一个对象的方法和属性@L_945_197@到另一个对象上Usage Example:var s1 = {name: "TestObj",test1: function(){alert("this is test1!");}}var s2 = {value: 1000,test2: function(){alert("this is test2!");}}var d = {};dojo.lang.mixin(d,s1,s2); //执行后d就具备了s1和s2的所有属性和方法d.test1();
dojo.lang.extend为指定类的原型扩展方法与属性Usage Example:TESTClass = function() {};dojo.lang.extend(TESTClass,{name: "demo",test: function(){alert("Test!");}});var o = new TESTClass(); //TESTClass本来是没有test方法的,但是extend以后就有test方法了o.test();
dojo.lang.find=dojo.lang.indexOf查找指定对象在指定数组中的位置Usage Example:var arr = [1,2,1];dojo.lang.find(arr,2); //will return 1dojo.lang.find(arr,truE); //will return 1dojo.lang.find(arr,"2",truE); //will return -1dojo.lang.find(arr,falsE); //will return 1dojo.lang.find(arr,true,truE); //will return 4
dojo.lang.findLast=dojo.lang.lasTindexOf查找指定对象在指定数组中的位置,从后往前查Usage Example:var arr = [1,1];dojo.lang.findLast(arr,2); //will return 4dojo.lang.findLast(arr,truE); //will return 4dojo.lang.findLast(arr,truE); //will return -1dojo.lang.findLast(arr,falsE); //will return 4
dojo.lang.inArray查找指定对象是否在指定数组中Usage Example:var arr = [1,3];dojo.lang.inArray(arr,1); //will return truedojo.lang.inArray(arr,4); //will return false
dojo.lang.isObject判断输入的类型是否为对象Usage Example:dojo.lang.isObject(new String()); //will return truedojo.lang.isObject("123")); //will return false
dojo.lang.isArray判断输入的类型是否为数组Usage Example:dojo.lang.isArray({a:1,b:2}); //will return falsedojo.lang.isArray([1,3]); //will return true
dojo.lang.isFunction判断输入的类型是否为函数Usage Example:dojo.lang.isFunction(function() {}); //will return true
dojo.lang.isString判断输入的类型是否为字符串Usage Example:dojo.lang.isString(""); //will return truedojo.lang.isString(0); //will return false
dojo.lang.isAlien判断输入的类型是否为系统函数Usage Example:dojo.lang.isAlien(isNaN); //will return true
dojo.lang.isBoolean判断输入的类型是否为布尔类型Usage Example:dojo.lang.isBoolean(2>1); //will return true
dojo.lang.isnumber判断输入的类型是否为数值,根据注释所说,此函数使用不太可靠,但是可替换使用的系统函数isNaN也不太可靠
dojo.lang.isUndefined判断输入是否为未定义,根据注释所说,此函数有可能会导致抛出异常,推荐使用 typeof foo == "undefined" 来判断
模块:dojo.lang.extras
dojo.lang.setTimeout延迟指定时间后执行指定方法Usage Example:function onTime(msg){dojo.debug(msg)}dojo.lang.setTimeout(onTime,1000,"test"); //1秒后会输出调试信息"test"dojo.lang.setTimeout(dojo,"debug","test"); //1秒后会输出调试信息"test"
dojo.lang.getNameInObj获得指定项目在指定对象中的@L_673_31@Usage Example:dojo.lang.getNameInObj(dojo,dojo.debug); //will return "debug"
dojo.lang.shallowCopy返回指定对象的浅表复制副本Usage Example:dojo.lang.shallowCopy({}); //will return a 空对象
dojo.lang.firstValued返回第一个存在定义的参数Usage Example:var a;dojo.lang.firstValued(a,3); //will return 2
以上全部是自己阅读源代码写的总结,如有错误,还请指明。
大佬总结
以上是大佬教程为你收集整理的Dojo学习笔记全部内容,希望文章能够帮你解决Dojo学习笔记所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。