Js分离与引用的帮助参考文档以及layout实现细节如下
Js、css分离：
1、.html的文件所在的文件夹，新建一个文件夹grid和import.css
2、在grid文件夹新建main.js、addLoad.js
3、<style type=”text/css” ></style>标签对里的内容剪切到import.css文件中，同时在.html文件中改成< link rel="stylesheet" type=”text/css” href=”import.css”></style>
4、将<head>标签对中的<script type=”text/javascript”>标签对里的内容剪切到main.js文件中，同时将<script>标签对改成<script type=”text/javascript” src=”grid/main.js” djConfig="isDebug:true","parseOnLoad: true"></script>
5、将<body>标签对中的<script type=”text/javascript”>标签对里的内容剪切到addLoad.js文件中，同时将<script>标签对改成<script type=”text/javascript” src=”grid/addLoad.js” djConfig="isDebug:true","parseOnLoad: true"></script>
注意红字部分：由于import.js是和.html在同一个根目录下，在引入的时候只要写“import.js”就行了。而main.js 、addLoad.js和.html不在同一个目录下，故要引入与.html同目录下的grid文件夹。
Layout实现：
任务：1、实现layout的显示
2、在layout中显示图片，并且使图片能自由放大，缩小。
3、js、css文档分离
完成情况：1、layout空间可以显示，通过region的相关值显示不同位置的控件，左中右上。
2、在layout的控件中显示两种图片形式，即改变像素和不改变像素
3、设置了layout空间的背景颜色。
4、layout控件中添加文字
遇到的问题：1、在不改变图片宽和高的比例的条件下，改变图片的大小。（未解决）
使用到相关组件：
1、 dijit.layout.BorderContainer
2、 dijit.layout.ContentPane
dojo开源代码文件：
1、 dojox.dx.js
2、 Claro.css
实现截图：
重要代码：
//定义了BorderContainer的大容器，其中包含了7个ContentPane容器
程序说明文档
dijit.layout.BorderContainer是一个对齐方式容器。
design属性：headline、sidebar。design 为“ headline ”，上下两个区域的宽度就会与 BorderContainer 的宽度相同；如果 design 为“ sidebar ”，左右两个区域的高度就会和 BorderContainer 的高度相同。
gutters属性：true、false（默认为true）。“True”为可以修改窗格与附近图表的边之间的距离。从而使窗格与窗格、窗格与BorderContainer之间保持一定距离。
liveSplitters属性：true、false。 “ true ”为用户可以自己调节屏面大小。“ false ”为不允许用户自己调节屏面大小。
liveSizing属性：true、false。“ true ”为用户即时地看到拖曳的效果。
dijit.layout.ContentPane： ContentPane是一个默认为空白的面板容器。ContentPane 可以盛放文本、图片、图表，甚至其它 widgets 。
splitter属性：true、false。True为允许拖曳隔条将修改尺寸。如果你想让用户的拖曳有个限度，可以指定minSize或maxSize的属性值来实现。尺寸限制了指定区域的长宽。其最小值和最大值默认分别是0px和"Infinity"，表示没有限制。
region属性： top、bottom、leading、tailing和center。
参考网址：
http://www.ibm.com/developerworks/cn/web/wa-lo-dojointro5/
http://www.cn-cuckoo.com/category/support
http://blog.163.com/eboge@126/blog/static/257055072010757426883/
8433
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
