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 相关文章推荐
关于javascript DOM事件模型的两件事
Jul 22 Javascript
javascript移出节点removeChild()使用介绍
Apr 03 Javascript
JavaScript中的公有、私有、特权和静态成员用法分析
Nov 20 Javascript
JS自定义对象实现Java中Map对象功能的方法
Jan 20 Javascript
JS实现表格数据各种搜索功能的方法
Mar 03 Javascript
JavaScript检查数字是否为整数或浮点数的方法
Jun 09 Javascript
javascript创建对象的3种方法
Nov 02 Javascript
ES6新数据结构Map功能与用法示例
Mar 31 Javascript
JavaScript通过filereader接口读取文件
May 10 Javascript
详解在vue-cli项目中使用mockjs(请求数据删除数据)
Oct 23 Javascript
node版本管理工具n包使用教程详解
Nov 09 Javascript
基于JavaScript实现贪吃蛇游戏
Mar 16 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
用ADODB来让PHP操作ACCESS数据库的方法
2006/12/31 PHP
PHP 配置open_basedir 让各虚拟站点独立运行
2009/11/12 PHP
用JavaScript将从数据库中读取出来的日期型格式化为想要的类型。
2009/08/15 Javascript
javascript preload&amp;lazy load
2010/05/13 Javascript
自用js开发框架小成 学习js的朋友可以看看
2010/11/16 Javascript
jQuery结合PHP+MySQL实现二级联动下拉列表[实例]
2011/11/15 Javascript
利用jquery写的左右轮播图特效
2014/02/12 Javascript
PHPMyAdmin导入时提示文件大小超出PHP限制的解决方法
2015/03/30 Javascript
jQuery日历插件datepicker用法详解
2016/03/03 Javascript
javascript中不易分清的slice,splice和split三个函数
2016/03/29 Javascript
微信小程序  Mustache语法详细介绍
2016/10/27 Javascript
js实现5秒倒计时重新发送短信功能
2017/02/05 Javascript
JS实现的全排列组合算法示例
2017/10/09 Javascript
小程序实现五星点评效果
2018/11/03 Javascript
微信小程序云开发实现数据添加、查询和分页
2019/05/17 Javascript
原生JavaScript创建不可变对象的方法简单示例
2020/05/07 Javascript
解决elementui表格操作列自适应列宽
2020/12/28 Javascript
python检测远程服务器tcp端口的方法
2015/03/14 Python
Python操作MySQL数据库9个实用实例
2015/12/11 Python
详解Python的collections模块中的deque双端队列结构
2016/07/07 Python
Python json 错误xx is not JSON serializable解决办法
2017/03/15 Python
Python标准库sched模块使用指南
2017/07/06 Python
pthon贪吃蛇游戏详细代码
2019/01/27 Python
使用python接入微信聊天机器人
2020/03/31 Python
python实现socket+threading处理多连接的方法
2019/07/23 Python
python不同系统中打开方法
2020/06/23 Python
HTML5 视频播放(video),JavaScript控制视频的实例代码
2018/10/08 HTML / CSS
AmazeUI的JS表单验证框架实战示例分享
2020/08/21 HTML / CSS
Farfetch阿联酋:奢侈品牌时尚购物平台
2019/07/26 全球购物
夜大毕业自我鉴定
2013/10/11 职场文书
报表员工作失误检讨书范文
2014/09/19 职场文书
家长通知书家长意见
2014/12/30 职场文书
通知范文怎么写
2015/04/16 职场文书
2015年乡镇妇联工作总结
2015/05/19 职场文书
初中生入团申请书范文(五篇)
2019/10/16 职场文书
Sql Server之数据类型详解
2022/02/28 SQL Server