zoukankan      html  css  js  c++  java
  • 【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什么的。

  • 相关阅读:
    python中常用的模块二
    python中常用的模块一
    python类与类的关系
    python类的成员
    关于python的面向对象
    python内置函数2
    python内置函数
    python fileinput模块
    python生成器
    python 迭代器
  • 原文地址:https://www.cnblogs.com/onsummer/p/8512145.html
Copyright © 2011-2022 走看看