当前位置: 代码迷 >> Web前端 >> dojo入门二_helloworld
  详细解决方案

dojo入门二_helloworld

热度:403   发布时间:2013-11-22 23:06:19.0
dojo入门2_helloworld
  上一篇谈了dojo的环境配置,现在我们可以来开始动手写一个dojo的helloworld程序了,代码如下图:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<style type="text/css">
@import "js/dojo-1.6.1/dijit/themes/tundra/tundra.css";
@import
"js/dojo-1.6.1/dojo/resources/dojo.css"
</style>
<script type="text/javascript" src="js/dojo-1.6.1/dojo/dojo.js"
djConfig="parseOnLoad:true">
</script>
<script type="text/javascript">
dojo.require("dijit.form.Button");
</script>
</head>
<body class="tundra">
<button dojoType="dijit.form.Button" id="helloButton">say Hello
<script type="dojo/method" event="onClick">
alert("hello world!");
</script></button>
</body>
</html>
现在来对以上部分代码解释一下
style里面的两个import 表示引入dojo的一些样式文件
script下的djConfig="parseOnLoad:true" 表示在加载dojo标签属性的时候就进行解析,如果没有这一句,下面的很多代码无法运行
下面的dojo.require("dijit.form.Button")表示引入dojo的button widget,widget表示插件,如button,input各种都是widget
<button dojoType="dijit.form.Button" id="helloButton">say Hello
这里的dojoType就是使用dojo自己来解析了,type属性表示使用的dojo插件
里面嵌套的脚本代码注册了一个onClick事件 当点击该button时,就会弹出hello world消息