dojo 之基础篇


Posted in Javascript onMarch 24, 2007

假设我们的工程目录如下:

-- HelloWorld.html  |-- js/     -- dojo/  /*此处是dojo包下面的文件,列表如下
       		 -- build.txt
       		 -- CHANGELOG
      		 -- demos         		  -- ..
       		 -- dojo.js
       		 -- dojo.js.uncompressed.js
       		 -- iframe_history.html
       		 -- LICENSE
       		 -- README
       		 -- src/
现在我们创建HelloWorld.html文件,代码如下:
<html>
 <head>
  <title>Dojo: Hello World!</title>  <!-- SECTION 1 -->
  <script type="text/javascript" src="js/dojo/dojo.js"></script>  <!-- SECTION 2 --> 
 </head> <body>
 </body>
</html>
在body中加入一个widget button
<button dojoType="Button" widgetId="helloButton">Hello World!</button>上面不一定要使用widgetId,用平常的id就行了,widget会自己将其转化为widgetId。
以下开始加入section 2的代码。
<!-- SECTION 2 -->
  <script type="text/javascript">   //引入库
   //event.*是处理事件,比如:点击,的所有包。
   dojo.require("dojo.event.*");
   dojo.require("dojo.widget.*");
   dojo.require("dojo.widget.Button");   //点击按钮后调用的函数
   function helloPressed()
   {
    alert('You pressed the button');
   }   //将helloButton的点击事件绑定到helloPressed()函数
   function init()
   {
    var helloButton = dojo.widget.byId('helloButton');//获得button对象
    dojo.event.connect(helloButton, 'onClick', 'helloPressed')//绑定,这只是其中一种绑定方法
   }   dojo.addOnLoad(init);//当然也可以将init函数命为其它的名
  </script>
这样,就完成了HelloWorld.html的代码. 试试吧.另外,要注意的是:
如果init函数已经运行了,我们再使用document.getElementById 就没用了. 因为DOM
已经被widget改变. 只能用dojo.widget.byId.
Javascript 相关文章推荐
ExtJS Grid使用SimpleStore、多选框的方法
Nov 20 Javascript
使用jQuery+HttpHandler+xml模拟一个三级联动的例子
Aug 09 Javascript
jQuery.lazyload+masonry改良图片瀑布流代码
Jun 20 Javascript
如何用JavaScript实现动态修改CSS样式表
May 20 Javascript
Javascript将数字转化成为货币格式字符串
Jun 22 Javascript
使用JS动态显示文本
Sep 09 Javascript
mongoose设置unique不生效问题的解决及如何移除unique的限制
Nov 07 Javascript
详解react内联样式使用webpack将px转rem
Sep 13 Javascript
vue实现pdf导出解决生成canvas模糊等问题(推荐)
Oct 18 Javascript
Makefile/cmake/node-gyp中区分判断不同平台的方法
Dec 18 Javascript
利用JS代码自动删除稿件的普通弹幕功能
Sep 20 Javascript
VueCli生产环境打包部署跨域失败的解决
Nov 13 Javascript
jQuery使用手册之 事件处理
Mar 24 #Javascript
jQuery使用手册之三 CSS操作
Mar 24 #Javascript
jQuery使用手册之二 DOM操作
Mar 24 #Javascript
jQuery使用手册之一
Mar 24 #Javascript
5 cool javascript apps
Mar 24 #Javascript
用JQuery 实现的自定义对话框
Mar 24 #Javascript
JQuery 简便实现页面元素数据验证功能
Mar 24 #Javascript
You might like
实用函数2
2007/11/08 PHP
php制作简单模版引擎
2016/04/07 PHP
用JavaScript获取网页中的js、css、Flash等文件
2006/12/20 Javascript
javascript 日历提醒系统( 兼容所有浏览器 )
2009/04/07 Javascript
JQuery SELECT单选模拟jQuery.select.js
2009/11/12 Javascript
JS关键字变色实现思路及代码
2013/02/21 Javascript
JS对象转换为Jquery对象实现代码
2013/12/29 Javascript
javascript作用域和闭包使用详解
2014/04/25 Javascript
AngularJS实现网站换肤实例
2021/02/19 Javascript
使用canvas进行图像编辑的实例
2017/08/29 Javascript
NodeJS实现不可逆加密与密码密文保存的方法
2018/03/16 NodeJs
NodeJS父进程与子进程资源共享原理与实现方法
2018/03/16 NodeJs
微信小程序显示倒计时功能示例【测试可用】
2018/12/03 Javascript
微信小程序实现点击按钮后修改颜色
2019/12/05 Javascript
[02:45]DOTA2英雄敌法师基础教程
2013/11/25 DOTA
Python数据类型详解(三)元祖:tuple
2016/05/08 Python
Python解析excel文件存入sqlite数据库的方法
2016/11/15 Python
Python通过future处理并发问题
2017/10/17 Python
Python中getpass模块无回显输入源码解析
2018/01/11 Python
python+ffmpeg视频并发直播压力测试
2018/03/06 Python
5分钟 Pipenv 上手指南
2018/12/20 Python
Python检查ping终端的方法
2019/01/26 Python
OpenCV+python实现实时目标检测功能
2020/06/24 Python
Python 忽略文件名编码的方法
2020/08/01 Python
使用canvas压缩图片上传的方法示例
2020/02/07 HTML / CSS
BIBLOO捷克:购买女装、男装、童装、鞋和配件
2017/01/27 全球购物
建筑班组长岗位职责
2014/01/02 职场文书
2014年监理工作总结范文
2014/11/17 职场文书
保安2014年终工作总结
2014/12/06 职场文书
毕业生爱心捐书倡议书
2015/04/27 职场文书
2015年共青团工作总结
2015/05/15 职场文书
院系推荐意见
2015/06/05 职场文书
教师节主题班会方案
2015/08/17 职场文书
2016优秀青年志愿者事迹材料
2016/02/25 职场文书
goland 恢复已更改文件的操作
2021/04/28 Golang
MySQL 使用索引扫描进行排序
2021/06/20 MySQL