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 相关文章推荐
特殊字符、常规符号及其代码对照表
Jun 26 Javascript
div模拟滚动条效果示例代码
Oct 16 Javascript
jQuery实现查找链接文字替换属性的方法
Jun 27 Javascript
利用D3.js实现最简单的柱状图示例代码
Dec 09 Javascript
JavaScript定义全局对象的方法示例
Jan 12 Javascript
jQuery动态产生select option下拉列表
Mar 15 Javascript
JavaScript Drum Kit 指南(纯 JS 模拟敲鼓效果)
Jul 23 Javascript
javascript trie前缀树的示例
Jan 29 Javascript
vue中element组件样式修改无效的解决方法
Feb 03 Javascript
jQuery仿移动端支付宝键盘的实现代码
Aug 15 jQuery
对layer弹出框中icon数字参数的说明介绍
Sep 04 Javascript
Vue CLI3移动端适配(px2rem或postcss-plugin-px2rem)
Apr 27 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
PHP分页显示制作详细讲解
2006/10/09 PHP
php中的比较运算符详解
2013/10/28 PHP
PHP按行读取文件时删除换行符的3种方法
2014/05/04 PHP
PHP实现小程序批量通知推送
2018/11/27 PHP
Yii 框架使用数据库(databases)的方法示例
2020/05/19 PHP
Javascript学习笔记1 数据类型
2010/01/11 Javascript
JavaScript中几种常见排序算法小结
2011/02/22 Javascript
了解一点js的Eval函数
2012/07/26 Javascript
javaScript让文本框内的最后一个文字的后面获得焦点实现代码
2013/01/06 Javascript
js中数组(Array)的排序(sort)注意事项说明
2014/01/24 Javascript
基于jquery的simpleValidate简易验证插件
2014/01/31 Javascript
js this函数调用无需再次抓获id,name或标签名
2014/03/03 Javascript
Javascript常用小技巧汇总
2015/06/24 Javascript
javascript中SetInterval与setTimeout的定时器用法
2015/08/24 Javascript
KnockoutJS 3.X API 第四章之数据控制流component绑定
2016/10/10 Javascript
手把手教你把nodejs部署到linux上跑出hello world
2017/06/19 NodeJs
JS简单实现动态添加HTML标记的方法示例
2018/04/08 Javascript
使用npm命令提示: 'npm' 不是内部或外部命令,也不是可运行的程序的处理方法
2020/05/14 Javascript
使用python编写android截屏脚本双击运行即可
2014/07/21 Python
举例详解Python中threading模块的几个常用方法
2015/06/18 Python
浅谈python可视化包Bokeh
2018/02/07 Python
tensorflow: 查看 tensor详细数值方法
2018/06/13 Python
Python图片转换成矩阵,矩阵数据转换成图片的实例
2018/07/02 Python
一篇文章弄懂Python中所有数组数据类型
2019/06/23 Python
使用Python来做一个屏幕录制工具的操作代码
2020/01/18 Python
Python开发之身份证验证库id_validator验证身份证号合法性及根据身份证号返回住址年龄等信息
2020/03/20 Python
美国最大的存储市场:SpareFoot
2018/07/23 全球购物
联想法国官方网站:Lenovo法国
2018/10/18 全球购物
美国领先的低折扣旅行网站:Hotwire
2019/01/19 全球购物
计算机大学生的自我评价
2013/10/15 职场文书
计算机专业个人简短的自我评价
2013/10/23 职场文书
毕业生的自我评价分享
2013/12/18 职场文书
清明节演讲稿
2014/05/27 职场文书
个人授权委托书样本
2014/09/13 职场文书
2015年教师新年寄语
2014/12/08 职场文书
Python采集股票数据并制作可视化柱状图
2022/04/04 Python