zoukankan      html  css  js  c++  java
  • RequireJS的简单应用

    一、RequireJS的主要作用与优点

    主要作用:js模块化、编写复用js代码

    优点:

    1、防止命名冲突

    2、声明不同js文件之间的依赖

    3、代码模块化

    (1)一个文件一个模块:每个js文件应该只定义一个模块

    (2)define()中注意相对模块名

    二、常用方法

    1、require.config  为模块指定别名

    2、require           引入写好的模块

    3、define            编写模块

    三、使用方法+一个小例子

    模块js写在html外面,由一个js进行模块加载

    例如我的工程目录结构

    |  src

    |   |——  js

                 |—— main.js

                 |—— test.js

    |  vender

    |   |——  js

                 |—— require.min.js

                 |—— jquery.min.js

    |

    |  test.html

    一个 Demo test.html

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>一个Require Test</title>
        <style>
    
            #myTest{
                height: 50px;;
                width: 50px;
                background-color: #28a4c9;
                text-align: center;
            }
        </style>
    </head>
    <body>
        <div id="myTest">Test</div>
        <script src="vender/js/require.min.js" data-main="src/js/main"></script>
    </body>
    </html>

    |—— main.js

    require.config({
        paths:{
            jquery: '../../vender/js/jquery.min'
        }
    });
    require(['jquery','test'],function($,test){
        test.fun1();
        $('#myTest').click(function(){
            console.log('myTest click2');
        });
    });

    |—— test.js

    define(['jquery'],function($){
        return {
            fun1:function(){
                $('#myTest').click(function(){
                    console.log('myTest click');
                });
            }
        }
    })
  • 相关阅读:
    MYSQL查看数据表最后更新时间
    linux在终端模拟软件实现文件上传下载
    yum常用操作
    释放Linux占用端口
    CentOS7.3编译安装MariaDB10.2.6
    CentOS7编译安装Nginx1.10.1
    Linux系统安装ActiveMQ时遇到服务无法启动的问题
    需求分析读书笔记(一)
    实用地址分享
    元素居中汇总
  • 原文地址:https://www.cnblogs.com/vanstrict/p/5715589.html
Copyright © 2011-2022 走看看