推荐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 相关文章推荐
JavaScript 匿名函数(anonymous function)与闭包(closure)
Oct 04 Javascript
Jquery获取复选框被选中值的简单方法
Jul 04 Javascript
每天一篇javascript学习小结(String对象)
Nov 18 Javascript
Js遍历键值对形式对象或Map形式的方法
Aug 08 Javascript
BootStrap+Angularjs+NgDialog实现模式对话框
Aug 24 Javascript
JS中判断null的方法分析
Nov 21 Javascript
快速入门Vue
Dec 19 Javascript
js实现模糊匹配功能
Feb 15 Javascript
微信小程序自定义可滑动日历界面
Dec 28 Javascript
Layui Table js 模拟选中checkbox的例子
Sep 03 Javascript
JavaScript之Blob对象类型的具体使用方法
Nov 29 Javascript
微信小程序聊天功能的示例代码
Jan 13 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
LotusPhp笔记之:Cookie组件的使用详解
2013/05/06 PHP
php检测文件编码的方法示例
2014/04/25 PHP
yii2项目实战之restful api授权验证详解
2017/05/20 PHP
Yii2.0使用阿里云OSS的SDK上传图片、下载、删除图片示例
2017/09/20 PHP
Apply an AutoFormat to an Excel Spreadsheet
2007/06/12 Javascript
jquery中获得$.ajax()事件返回的值并添加事件的方法
2010/04/15 Javascript
js实现双向链表互联网机顶盒实战应用实现
2011/10/28 Javascript
js bind 函数 使用闭包保存执行上下文
2011/12/26 Javascript
关于extjs4如何获取grid修改后的数据的问题
2013/08/07 Javascript
浏览器兼容console对象的简要解决方案分享
2013/10/24 Javascript
JavaScript/Js脚本处理html元素的自定义属性解析(亲测兼容Firefox与IE)
2013/11/25 Javascript
浅谈 jQuery 事件源码定位问题
2014/06/18 Javascript
JS判断是否为JSON对象及是否存在某字段的方法(推荐)
2016/11/29 Javascript
jquery对所有input type=text的控件赋值实现方法
2016/12/02 Javascript
mpvue跳转页面及注意事项
2018/08/03 Javascript
JavaScript数组特性与实践应用深入详解
2018/12/30 Javascript
layer插件实现在弹出层中弹出一警告提示并关闭弹出层的方法
2019/09/24 Javascript
JavaScript实现省市联动效果
2019/11/22 Javascript
Node使用koa2实现一个简单JWT鉴权的方法
2021/01/26 Javascript
JavaScript实现手风琴效果
2021/02/18 Javascript
浅谈python常用程序算法
2019/03/22 Python
解决python ThreadPoolExecutor 线程池中的异常捕获问题
2020/04/08 Python
Pycharm安装并配置jupyter notebook的实现
2020/05/18 Python
IE矩阵Matrix滤镜旋转与缩放及如何结合transform
2012/11/29 HTML / CSS
英国皇家邮政海外旗舰店:Royal Mail
2018/02/21 全球购物
Rag & Bone官网:瑞格布恩高级成衣
2018/04/19 全球购物
经济实惠的豪华背包和行李袋:Packs Project
2018/10/17 全球购物
抽象类和接口的区别
2012/09/19 面试题
大二法学专业职业生涯规划范文
2014/02/12 职场文书
纪检监察建议书
2014/05/19 职场文书
网络营销策划方案
2014/06/04 职场文书
团支部组织委员竞选稿
2015/11/21 职场文书
公务员的复习计划书,请收下!
2019/07/15 职场文书
手写实现JS中的new
2021/11/07 Javascript
教你使用Ubuntu搭建DNS服务器
2022/09/23 Servers
CSS中理解层叠性及权重如何分配
2022/12/24 HTML / CSS