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 相关文章推荐
不错的新闻标题颜色效果
Dec 10 Javascript
Jquery 组合form元素为json格式,asp.net反序列化
Jul 09 Javascript
js对象基础实例分析
Jan 13 Javascript
Jquery 实现图片轮换
Jan 28 Javascript
jQuery实现监控页面所有ajax请求的方法
Dec 10 Javascript
js模拟微博发布消息
Feb 23 Javascript
JavaScript评论点赞功能的实现方法
Mar 13 Javascript
jQuery插件FusionCharts绘制2D环饼图效果示例【附demo源码】
Apr 10 jQuery
vue.js组件vue-waterfall-easy实现瀑布流效果
Aug 22 Javascript
浅谈JavaScript的innerWidth与innerHeight
Oct 12 Javascript
bootstrap table列和表头对不齐的解决方法
Jul 19 Javascript
vue选项卡切换的实现案例
Apr 11 Vue.js
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
《Pokemon Sword·Shield》系列WEB动画《薄明之翼》第2话声优阵容公开!
2020/03/06 日漫
探讨PHP中OO之静态关键字以及类常量的详解
2013/06/07 PHP
PHP生成自适应大小的缩略图类及使用方法分享
2014/05/06 PHP
php实现的mongodb操作类实例
2015/04/03 PHP
使用PHP+Redis实现延迟任务,实现自动取消订单功能
2019/11/21 PHP
PHP文件操作简单介绍及函数汇总
2020/12/11 PHP
javascript event 事件解析
2011/01/31 Javascript
JQuery select控件的相关操作实现代码
2012/09/14 Javascript
js设置控件的隐藏与显示的两种方法
2014/08/21 Javascript
JS实现带圆弧背景渐变效果的导航菜单代码
2015/10/13 Javascript
JS实现网页右侧带动画效果的伸缩窗口代码
2015/10/29 Javascript
jQuery+PHP实现微信转盘抽奖功能的方法
2016/05/25 Javascript
JS不用正则验证输入的字符串是否为空(包含空格)的实现代码
2016/06/14 Javascript
特殊日期提示功能的实现方法
2016/06/16 Javascript
原生JS简单实现ajax的方法示例
2016/11/29 Javascript
jQuery实现立体式数字滚动条增加效果
2016/12/21 Javascript
vue.js的手脚架vue-cli项目搭建的步骤
2017/08/30 Javascript
jquery+ajaxform+springboot控件实现数据更新功能
2018/01/22 jQuery
[01:09]DOTA2次级职业联赛 - 99战队宣传片
2014/12/01 DOTA
pycharm+django创建一个搜索网页实例代码
2018/01/24 Python
python安装后的目录在哪里
2020/06/21 Python
Django视图类型总结
2021/02/17 Python
Django后端按照日期查询的方法教程
2021/02/28 Python
HTML5标签与HTML4标签的区别示例介绍
2013/07/18 HTML / CSS
使用javascript和HTML5 Canvas画的四渐变色播放按钮效果
2014/04/10 HTML / CSS
英国儿童图书网站:Scholastic
2017/03/26 全球购物
行政副总岗位职责
2014/02/23 职场文书
2014党员学习兰辉先进事迹思想汇报
2014/09/17 职场文书
检讨书格式
2015/01/23 职场文书
2016年安全生产先进个人事迹材料
2016/02/29 职场文书
详解CSS不定宽溢出文本适配滚动
2021/05/24 HTML / CSS
七个非常实用的Python工具包总结
2021/06/15 Python
Java数组与堆栈相关知识总结
2021/06/29 Java/Android
css3带你实现3D转换效果
2022/02/24 HTML / CSS
oracle删除超过N天数据脚本的方法
2022/02/28 Oracle
MySQL的存储过程和相关函数
2022/04/26 MySQL