推荐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 相关文章推荐
js网页版计算器的简单实现
Jul 02 Javascript
javascript特殊用法示例介绍
Nov 29 Javascript
js行号显示的文本框实现效果(兼容多种浏览器 )
Oct 23 Javascript
js实现新年倒计时效果
Dec 10 Javascript
浅谈React和Redux的连接react-redux
Dec 04 Javascript
JS获取input[file]的值并显示在页面的实现方法
Mar 09 Javascript
微信小程序map组件结合高德地图API实现wx.chooseLocation功能示例
Jan 23 Javascript
JS Math对象与Math方法实例小结
Jul 05 Javascript
JavaScript获取时区实现过程解析
Sep 24 Javascript
js实现弹框效果
Mar 24 Javascript
JavaScript ES6的函数拓展
Jan 18 Javascript
AudioContext 实现音频可视化(web技术分享)
Feb 24 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基于单例模式实现的数据库操作基类
2016/01/15 PHP
PHP实现一个简单url路由功能实例
2016/11/05 PHP
Thinkphp开发--集成极光推送
2017/09/15 PHP
javascript引用对象的方法
2007/01/11 Javascript
jQuery学习5 jQuery事件模型
2010/02/07 Javascript
IE6、IE7中setAttribute不支持class/for/rowspan/colspan等属性
2011/08/28 Javascript
FF火狐下获取一个元素同类型的相邻元素实现代码
2012/12/15 Javascript
如何通过javascript操作web控件的自定义属性
2013/11/25 Javascript
使用jquery实现以post打开新窗口
2014/03/19 Javascript
jQuery团购倒计时特效实现方法
2015/05/07 Javascript
Backbone.js框架中简单的View视图编写学习笔记
2016/02/14 Javascript
深入理解事件冒泡(Bubble)和事件捕捉(capture)
2016/05/28 Javascript
JavaScript仿flash遮罩动画效果
2016/06/15 Javascript
jQuery展示表格点击变色、全选、删除
2017/01/05 Javascript
用node-webkit把web应用打包成桌面应用(windows环境)
2018/02/01 Javascript
[原创]jQuery实现合并/追加数组并去除重复项的方法
2018/04/11 jQuery
JavaScript变量声明var,let.const及区别浅析
2018/04/23 Javascript
基于JavaScript实现猜数字游戏代码实例
2020/07/30 Javascript
python fabric实现远程操作和部署示例
2014/03/25 Python
python 自定义对象的打印方法
2019/01/12 Python
Python画图实现同一结点多个柱状图的示例
2019/07/07 Python
正则给header的冒号两边参数添加单引号(Python请求用)
2019/08/09 Python
Python3 main函数使用sys.argv传入多个参数的实现
2019/12/25 Python
彻底搞懂 python 中文乱码问题(深入分析)
2020/02/28 Python
Tensorflow中的dropout的使用方法
2020/03/13 Python
让IE下支持Html5的placeholder属性的插件
2014/09/02 HTML / CSS
巴西男士胡须和头发护理产品商店:Beard
2017/11/13 全球购物
汉米尔顿手表官网:Hamilton
2020/09/13 全球购物
成都思必达公司C#程序员招聘面试题
2013/06/26 面试题
Linux上比较文件的命令都有哪些
2012/02/24 面试题
安全生产演讲稿
2014/05/09 职场文书
地理科学专业自荐信
2014/09/01 职场文书
单位领导婚礼致辞
2015/07/28 职场文书
2016年中学植树节活动总结
2016/03/16 职场文书
小学生优秀作文范文(六篇)
2019/07/10 职场文书
用python删除文件夹中的重复图片(图片去重)
2021/05/12 Python