推荐dojo学习笔记

  在引用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

  先介绍这么多,祝大家周末愉快!