【Dojo 1.x】笔记1 入门
Dojo是个框架 ,是个js框架,现在除了这一点什么都不知道,就这么上手了。
ps:不建议Web初学者看我的笔记,这个要有一定积累才能看。
在<body>标签内写这么一点代码:
<body>
<h1 id="greeting">Hello</h1>
<script src="//ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojo/dojo.js" data-dojo-config="async: true"></script>
</body>
按下F12,没报错,算是用CDN引用成功了Dojo。
如果F12报错无法访问dojo.js,请到BootCDN引用,现在暂时不自己开本地服务器引用,以后再说。
1. AMD:异步模块
自1.7起,Dojo就启动了AMD异步模块定义的支持,原因是为了更好地支持大型复杂Web程序。
可见,Dojo是一个重量级框架。
2. 全局函数
算是加载了dojo.js这个文件后的两个入口吧,是两个全局函数:define和require
上面提及,Dojo支持异步模块定义了,那么define就能定义一个模块,而requie就能用你定义的模块。
——有关为什么用define和require这种奇怪的写法,请阅读http://dojotoolkit.org/documentation/tutorials/1.10/modern_dojo/
通常,模块是一个简单的js文件。
以下通过简单的HTML DOM操作来演示define和require,Dojo中操作DOM的模块是'dojo/dom', 'dojo/dom-construct'两个。
demo
<!DOCTYPE html>
<html> <head>
<meta charset="utf-8">
<title>Tutorial: Hello Dojo!</title>
</head> <body>
<h1 id="greeting">Hello</h1>
<script src="https://cdn.bootcss.com/dojo/1.10.4/dojo.js" data-dojo-config="async: true"></script> <script>
require(
[
'dojo/dom',
'dojo/dom-construct'
],
function(dom, domConstruct) {
var greetingNode = dom.byId('greeting');
domConstruct.place('<em> Dojo!</em>', greetingNode);
}
);
</script>
</body> </html>
我换掉了CDN引用,这样会快一些。
可见HTML文本改变了,引用了dom和dom-construct两个模块后,就能用dom.byId这个方法和domConstruct.place这个方法进行DOM操作了。
代码解释
require有两个参数。
第一个是字符串数组,代表模块的id(或者带路径的模块名称),为什么是这样写,请学习AMD知识或者node.js或者前端js模块化编程。如果下载了SDK,是能在文件夹里找到dom.js和dom-construct.js这两个文件的。
第二个是回调函数。回调函数的参数就是以上引入的模块。回调函数的参数的名字可以自定义,但是顺序是和第一个字符串数组的模块顺序一致的。
由于AMD机制和异步操作,这就意味着,等待模块加载完成后,回调函数才会正式运作,但是这是自动的,在后台自己做完一切。大可不必管交叉调用js文件和模块的问题,AMD机制自己会在后台完成模块之间的交叉调用问题。
3. 说两句话
理解异步操作、js模块化,是Dojo学习中相当重要的。与普通的js框架不同,Dojo更合适开发复杂的大型Web平台。
有兴趣的同学可以学习一下ES6的模块化编程,或者学习一下npm+webpack这种新型的后端写法,node.js也是可以看看的。
目前只学到这里,暂时还是双击打开html文件查看代码成果,下一个笔记就要用本地服务器打开了,可以用IIS,也可以用XAMPP,无所谓。
暂时等这种静态写法学完后,就试着用npm包管理机制写一写试试,混搭Vue什么的。
【Dojo 1.x】笔记1 入门的更多相关文章
- python学习笔记--Django入门四 管理站点--二
接上一节 python学习笔记--Django入门四 管理站点 设置字段可选 编辑Book模块在email字段上加上blank=True,指定email字段为可选,代码如下: class Autho ...
- WebSocket学习笔记——无痛入门
WebSocket学习笔记——无痛入门 标签: websocket 2014-04-09 22:05 4987人阅读 评论(1) 收藏 举报 分类: 物联网学习笔记(37) 版权声明:本文为博主原 ...
- Java学习笔记之---入门
Java学习笔记之---入门 一. 为什么要在众多的编程语言中选择Java? java是一种纯面向对象的编程语言 java学习起来比较简单,适合初学者使用 java可以跨平台,即在Windows操作系 ...
- Bootstrap笔记--快速入门
首先是Bootstrap的简介: 业余了解:下面这个网址可以查询IP地址的地理位置 下面学习:(具体可以参考Bootstrap中文网) 栅格系统 Bootstrap 提供了一套响应式.移动设备优先的流 ...
- DBFlow框架的学习笔记之入门
什么是DBFlow? dbflow是一款android高性的ORM数据库.可以使用在进行项目中有关数据库的操作.github下载源码 1.环境配置 先导入 apt plugin库到你的classpat ...
- MongoDB学习笔记:快速入门
MongoDB学习笔记:快速入门 一.MongoDB 简介 MongoDB 是由C++语言编写的,是一个基于分布式文件存储的开源数据库系统.在高负载的情况下,添加更多的节点,可以保证服务器性能.M ...
- 学习笔记_J2EE_SpringMVC_01_入门
1. 概述 笔者作为一个不太正经的不专业佛教信仰者,习惯了解事物的因果关系,所以概述就有点BBB...了.如果不喜欢这些的,请自行跳过概述章节,直接进入第二章的操作实践:2 入门示例. 1.1. ...
- dubbo入门学习笔记之入门demo(基于普通maven项目)
注:本笔记接dubbo入门学习笔记之环境准备继续记录; (四)开发服务提供者和消费者并让他们在启动时分别向注册中心注册和订阅服务 需求:订单服务中初始化订单功能需要调用用户服务的获取用户信息的接口(订 ...
- SpringBoot学习笔记<一>入门与基本配置
毕业实习项目技术学习笔记 参考文献 学习视频 2小时学会Spring Boot:https://www.imooc.com/learn/767 学习资料 SpringBoot入门:https://bl ...
随机推荐
- C++ : cin.get()函数和cin函数的使用
笔者由于自己忘记了cin函数怎么用,所以这里趁自己复习C++的空子正好可以做做记录. 1.cin>> 用法1:最基本,也是最常用的用法,输入一个数字: #include ...
- 【安富莱二代示波器教程】第6章 示波器设计—双通道ADC驱动
第6章 示波器设计—双通道ADC驱动 本章节为大家讲解示波器的ADC驱动,采用STM32自带ADC实现.关于STM32F429的ADC,可以说处处有地雷,不小心就踩上了,如果简单的使用, ...
- 【安富莱专题教程第5期】工程调试利器RTT实时数据传输组件,替代串口调试,速度飞快,可以在中断和多任务中随意调用
说明:1.串口作为经典的调试方式已经存在好多年了,缺点是需要一个专门的硬件接口.现在有了SEGGER的RTT(已经发布有几年了),无需占用系统额外的硬件资源,而且速度超快,是替代串口调试的绝佳方式.2 ...
- Java 网络IO编程总结(BIO、NIO、AIO均含完整实例代码)
本文会从传统的BIO到NIO再到AIO自浅至深介绍,并附上完整的代码讲解. 下面代码中会使用这样一个例子:客户端发送一段算式的字符串到服务器,服务器计算后返回结果到客户端. 代码的所有说明,都直接作为 ...
- [Swift]LeetCode228. 汇总区间 | Summary Ranges
Given a sorted integer array without duplicates, return the summary of its ranges. Example 1: Input: ...
- [Swift]LeetCode567. 字符串的排列 | Permutation in String
Given two strings s1 and s2, write a function to return true if s2 contains the permutation of s1. I ...
- [Swift]LeetCode692. 前K个高频单词 | Top K Frequent Words
Given a non-empty list of words, return the k most frequent elements. Your answer should be sorted b ...
- [Swift]LeetCode805. 数组的均值分割 | Split Array With Same Average
In a given integer array A, we must move every element of A to either list B or list C. (B and C ini ...
- Docker基础命令和时区问题
Docker 命令 1. 安装Docker # ubuntu系统安装 $ sudo apt install docker-ce # 启动docker $ sudo systemctl start do ...
- 手把手的教你激活PyCharm --Pycharm激活详细教程(二)(非常详细,非常实用)
简介 Pycharm安装以后必须激活后,才能正常的使用.否则就不能使用. 激活PyCharm 1.Activation code激活 优点:Window.Mac.Ubantu都稳定有效,关键是这种激活 ...