推荐dojo学习笔记


Posted in Javascript onMarch 24, 2007

在引用dojo.js前,最好声明djConfig对象,以便在加载dojo.js时能够取得所设置的值,虽然在0.3版本以后dojo支持在加载后设置,但是强烈建议你把声明djConfig的代码作为第一段script:
一个完整的djConfig对象定义如下(值均为dojo的默认值)
js 代码
var djConfig = {    
   isDebug: false,    
   debugContainerId: "",    
   bindEncoding: "",    
   allowQueryConfig: false,    
   baseScriptUri: "",    
   parseWidgets: true   
   searchIds: [],    
   baseRelativePath: "",    
   libraryScriptUri: "",    
   iePreventClobber: false,    
   ieClobberMinimal: true,    
   preventBackButtonFix: true,    

debugContainerId同样也是与调试有关的,如果不指定的话,调试信息将会直接利用 document.write输出,这样可能会破坏页面的整体布局,所以你可以指定任何一个可以作为容器的html元素的id作为调试信息输出容器
allowQueryConfig,这个属性指明 dojo是否允许从页面url的参数中读取djConfig中的相关属性,当值为true时,dojo会优先从url参数中读取djConfig的其他属性,比如: http://server/dojoDemo.htm?djConfig.debugContainerId=divDebug
baseScriptUri,一般不需要设置,dojo会自动根据你引用dojo.js的路径设置这个值,比如,<script src="../dojo/dojo.js" type="text/javascript"></script>,自动获取的值便是 ../dojo/
ps: 如果你有多个工程需要同时引用dojo.js的话,建议也把dojo当作一个独立的工程,引用的时候采用绝对路径就可以了
parseWidgets,这个是可以控制dojo是否自动解析具有dojoType的html元素为对应的widget,如果你没有使用任何Widget,建议设置为false以加快dojo的加载速度
searchIds,这是一个字符串数组,定义了所有需要解析为widget的html元素的ID,如果ID不在其中的html元素是不会被解析的,当数组为空数组时,则所有具有dojoType的元素都会被解析
还有一个bindEncoding,是用来设置默认的bind请求的编码方式。
dojo.raise抛出一个异常
dojo.errorToString将异常转换为字符串
js 代码
try {    
   dojo.raise("打印失败", new Error("文件不存在"));    
} catch(e)    
{    
   alert(dojo.errorToString(e));    
}    
isDebug是一个很有用的属性,如果设置为真,则所有dojo.Debug的输出有效,开发时应该设置为true,发布时应该设置为false。
1 计算HTML中一个块的size
js 代码
dojo.style.getOuterWidth / dojo.style.getOuterHeight     
dojo.style.getInnerWidth / dojo.style.getInnerHeight   
2 修改CSS
js 代码
dojo.html.addClass(node, className)     
dojo.html.prependClass(node, className)     
dojo.html.removeClass(node, className)     
dojo.html.replaceClass(node, className, oldClassName)   
3 动画
js 代码
fadeIn, fadeShow, fadeOut, fadeHide,     
wipeIn, wipeOut      
explode, implode     
highlight, unhighlight     
举例:     
    function wipeOut(elId){    
        dojo.lfx.wipeOut(elId, 300).play();    
    }    
    function wipeIn(elId) {    
        dojo.lfx.wipeIn(elId, 300).play();    
    }    
    function fadeOut(elId){    
       dojo.lfx.html.fadeOut(elId, 300).play();    
    }    
    function fadeIn(elId){    
       dojo.lfx.html.fadeIn(elId, 300).play();    
    }    
    function opacity(elId){    
       dojo.html.setOpacity(elId, 0.5);    
    }    
    function opacityApp(){    
       $("#opacity").click(function(){    
          opacity('fadeElm');    
       });    
    }    
    function fadeInApp(){    
       $("#fadein").click(function(){    
            fadeIn('fadeElm');    
        });    
    }   dojo.lang模块:
dojo.lang.mixin将一个对象的方法和属性增加到另一个对象上:
js 代码
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为指定类的原型扩展方法与属性:
js 代码
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查找指定对象在指定数组中的位置:
js 代码
var arr = [1,2,3,3,2,1];    
dojo.lang.find(arr, 2);   //will return 1   
dojo.lang.extrasdojo.lang.setTimeout延迟指定时间后执行指定方法:
js 代码
function onTime(msg){dojo.debug(msg)}    
dojo.lang.setTimeout(onTime, 1000, "test"); //1秒后会输出调试信息"test"  
DOM操作
js 代码
dojo.dom.isNode    
dojo.dom.getTagName    
dojo.dom.firstElement    
dojo.dom.lastElement    
dojo.dom.nextElement    
dojo.dom.prevElement    
dojo.dom.moveChildren (srcNode, destNode, trim)    
dojo.dom.copyChildren (srcNode, destNode, trim)    
dojo.dom.removeChildren(node)    
dojo.dom.replaceChildren(node, newChild)    
dojo.dom.removeNode(node)    
dojo.dom.getAncestors    
dojo.dom.getAncestorsByTag    
dojo.dom.innerXML    
dojo.dom.createDocumentFromText    
dojo.dom.prependChild    
dojo.dom.insertAfter    
dojo.dom.insertAtPosition    
dojo.dom.textContent    
先介绍这么多,祝大家周末愉快!

Javascript 相关文章推荐
发布BlueShow v1.0 图片浏览器(类似lightbox)blueshow.js 打包下载
Jul 21 Javascript
JavaScript 对象、函数和继承
Jul 07 Javascript
xml 封装与解析(javascript和C#中)
Jul 26 Javascript
基于jQuery的左右滚动实现代码
Dec 03 Javascript
P3P Header解决Cookie跨域的问题
Mar 12 Javascript
jquery遍历checkbox的注意事项说明
Feb 21 Javascript
jquery库文件略庞大用纯js替换jquery的方法
Aug 12 Javascript
js实现Select下拉框具有输入功能的方法
Feb 06 Javascript
jquery.fastLiveFilter.js实现输入自动过滤的方法
Aug 11 Javascript
Wireshark基本介绍和学习TCP三次握手
Aug 15 Javascript
JavaScript实现京东快递单号查询
Nov 30 Javascript
一篇文章弄清楚Ajax请求的五个步骤
Mar 17 Javascript
利用Dojo和JSON建立无限级AJAX动态加载的功能模块树
Mar 24 #Javascript
tbody元素支持嵌套的注意方法
Mar 24 #Javascript
xml 与javascript结合的问题解决方法
Mar 24 #Javascript
用prototype实现的简单小巧的多级联动菜单
Mar 24 #Javascript
this[] 指的是什么内容 讨论
Mar 24 #Javascript
javascript对象的property和prototype是这样一种关系
Mar 24 #Javascript
Ajax一统天下之Dojo整合篇
Mar 24 #Javascript
You might like
PHP学习笔记之三 数据库基本操作
2011/01/17 PHP
php静态文件生成类实例分析
2015/01/03 PHP
jQuery ajax serialize()方法的使用以及常见问题解决
2013/01/27 Javascript
js 验证密码强弱的小例子
2013/03/21 Javascript
javascript 上下banner替换具体实现
2013/11/14 Javascript
对 jQuery 中 data 方法的误解分析
2014/06/18 Javascript
JavaScript中跨域调用Flash的方法
2014/08/11 Javascript
jQuery过滤选择器详解
2015/01/13 Javascript
javascript中数组的定义及使用实例
2015/01/21 Javascript
JavaScript编程中容易出BUG的几点小知识
2015/01/31 Javascript
JavaScript常用脚本汇总(一)
2015/03/04 Javascript
Prototype框架详解
2015/11/25 Javascript
JS使用面向对象技术实现的tab选项卡效果示例
2017/02/28 Javascript
nodejs读写json文件的简单方法(必看)
2017/03/09 NodeJs
基于Bootstrap框架实现图片切换
2017/03/10 Javascript
收藏AngularJS中最重要的核心功能
2017/07/09 Javascript
JS实现的走迷宫小游戏完整实例
2017/07/19 Javascript
vue基础之使用get、post、jsonp实现交互功能示例
2019/03/12 Javascript
vue-cli3+ts+webpack实现多入口多出口功能
2019/05/30 Javascript
详解JWT token心得与使用实例
2019/08/02 Javascript
layui异步加载table表中某一列数据的例子
2019/09/16 Javascript
[01:02:09]Liquid vs TNC 2019国际邀请赛淘汰赛 胜者组 BO3 第二场 8.21
2020/07/19 DOTA
python 七种邮件内容发送方法实例
2014/04/22 Python
Python程序设计入门(4)模块和包
2014/06/16 Python
Python复制目录结构脚本代码分享
2015/03/06 Python
Python完成毫秒级抢淘宝大单功能
2019/06/06 Python
Python 实现的 Google 批量翻译功能
2019/08/26 Python
台湾流行服饰购物平台:OB严选
2018/01/21 全球购物
俄罗斯品牌服装在线商店:VIPAVENUE
2020/08/10 全球购物
潘多拉珠宝俄罗斯官方网上商店:PANDORA俄罗斯
2020/09/22 全球购物
英国马莎百货印度官网:Marks & Spencer印度
2020/10/08 全球购物
学生党员思想汇报
2013/12/28 职场文书
自立自强的名人事例
2014/02/10 职场文书
美丽乡村建设实施方案
2014/03/23 职场文书
元旦晚会开场白
2015/05/29 职场文书
Python机器学习之KNN近邻算法
2021/05/14 Python