推荐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 DOM 编程艺术(第2版)读书笔记(JavaScript的最佳实践)
Oct 01 Javascript
JavaScript操作DOM元素的childNodes和children区别
Apr 01 Javascript
JS中生成随机数的用法及相关函数
Jan 09 Javascript
JavaScript对象封装的简单实现方法(3种方法)
Jan 03 Javascript
javascript实现一个网页加载进度loading
Jan 04 Javascript
详解Vue中状态管理Vuex
May 11 Javascript
Vue验证码60秒倒计时功能简单实例代码
Jun 22 Javascript
详解jQuery-each()方法
Mar 13 jQuery
详解Js里的for…in和for…of的用法
Mar 28 Javascript
小程序使用watch监听数据变化的方法详解
Sep 20 Javascript
Vue利用Blob下载原生二进制数组文件
Sep 25 Javascript
JavaScript中的Proxy对象
Nov 27 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
dedecms 批量提取第一张图片最为缩略图的代码(文章+软件)
2009/10/29 PHP
PHP面向对象详解(三)
2015/12/07 PHP
thinkphp3.x连接mysql数据库的方法(具体操作步骤)
2016/05/19 PHP
js的alert样式如何更改如背景颜色
2014/01/22 Javascript
chrome下img加载对height()的影响示例探讨
2014/05/26 Javascript
js 数组去重的四种实用方法
2014/09/09 Javascript
js+css简单实现网页换肤效果
2015/12/29 Javascript
原生javascript实现自动更新的时间日期
2016/02/12 Javascript
Angular的$http的ajax的请求操作(推荐)
2017/01/10 Javascript
javascript中json基础知识详解
2017/01/19 Javascript
JS仿JQuery选择器功能
2017/03/08 Javascript
在 Vue 项目中引入 tinymce 富文本编辑器的完整代码
2018/05/04 Javascript
AngularJS标签页tab选项卡切换功能经典实例详解
2018/05/16 Javascript
layui 优化button按钮和弹出框的方法
2018/08/15 Javascript
js get和post请求实现代码解析
2020/02/06 Javascript
[01:01:14]完美世界DOTA2联赛PWL S2 SZ vs Rebirth 第一场 11.21
2020/11/23 DOTA
python中redis的安装和使用
2016/12/04 Python
在Python 不同级目录之间模块的调用方法
2019/01/19 Python
python 整数越界问题详解
2019/06/27 Python
python实现猜数字游戏
2020/03/25 Python
Python zip函数打包元素实例解析
2019/12/11 Python
python图形开发GUI库pyqt5的基本使用方法详解
2020/02/14 Python
input元素的url类型和email类型简介
2012/07/11 HTML / CSS
浅谈Html5多线程开发之WebWorkers
2018/05/02 HTML / CSS
乌克兰排名第一的在线旅游超市:Farvater.Travel
2020/01/02 全球购物
《北京的春节》教学反思
2014/04/07 职场文书
中华魂演讲稿
2014/05/13 职场文书
说谎欺骗人检讨书300字
2014/11/18 职场文书
技术股东合作协议书
2014/12/02 职场文书
逃课检讨书范文
2015/05/06 职场文书
幼师辞职信范文大全
2015/05/12 职场文书
初中班主任工作总结2015
2015/05/13 职场文书
离开雷锋的日子观后感
2015/06/09 职场文书
职工趣味运动会开幕词
2016/03/04 职场文书
对PyTorch中inplace字段的全面理解
2021/05/22 Python
详解Python中的进程和线程
2021/06/23 Python