当前位置:Gxlcms > JavaScript > 推荐dojo学习笔记_dojo

推荐dojo学习笔记_dojo

时间:2021-07-01 10:21:17 帮助过:11人阅读

在引用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的路径设置这个值,比如,输出有效,开发时应该设置为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
先介绍这么多,祝大家周末愉快!

人气教程排行