dojo组件渲染过程

没想到第一篇文章就被选为推荐文章，所以要更加加把劲写了，这里科普性质的介绍一下dojo组件渲染过程。
首先是dojo组件的引用机制，引用dojo组件有两种方式：
一：通过script标签
二：通过dojo.require
第一种方式就没什么可说的了，第二种方式是一种比较方便但是又比较影响性能的方式，dojo.require入参是组件名，字符串参数，dojo的组件名参照类似java包的方式，通过路径名和文件名确定（有例外），比如dijit.form.Button，这个组件的脚本就在dojo包目录同级目录向下找，首先dojo包，也就是dojo.js所在目录，和这个目录平级应该有个叫dijit的目录，下面有个form目录，下面有个Button.js文件，button组件代码就在这个脚本中（有例外），dojo.require就是通过上述方法确定该脚本的路径，然后通过同步的ajax请求，请求到这个组件的脚本代码，再通过eval的方式加载到页面中，执行结果跟script标签引用一样效果，但是需要注意，dojo.require通过同步的ajax请求，而且一个浏览器能同时发送的请求数有限，所以会导致页面加载比较慢，这个请求可以使用浏览器缓存。
然后是dojo组件渲染，不论是手动还是自动调用dojo.parser.parse()，它会遍历到body中所有节点，找到带自定义属性dojoType的节点，这样的节点就是dojo需要渲染的节点，dojoType的值就是需要用哪个组件进行渲染，比如：
<div dojoType="dijit.form.Button"></div>
在渲染之前首先需要确定页面上已经加载了这个叫做"dijit.form.Button"的组件，否则页面会报脚本错误，dojo会new一个对应的组件实例，然后通过dijit组件框架把这个div传给它进行渲染，如果组件继承了dijit._Template的话，一般页面上写div或者font span都可以，因为template的作用是指定一个outerHTML，将页面上不论什么节点完全替换掉，所以页面上写什么都无所谓了，另外在写html时候需要注意，有innerHTML属性的节点需要用</xx>结束，比如div，<div></div>，而没有innerHTML属性的节点需要使用/>结束，比如input，<input/>，否则兼容性上会有一些问题。

欢迎光临我的独立博客http://bwong.me