eg_requirejs

最新推荐文章于 2023-02-21 19:42:42 发布

pzmyg

最新推荐文章于 2023-02-21 19:42:42 发布

阅读量94

点赞数

分类专栏： Web

本文链接：https://blog.csdn.net/pzmyg/article/details/80986040

版权

Web 专栏收录该内容

8 篇文章 0 订阅

订阅专栏

1、新建web工程，下载require.js添加到项目中
2、新建requirejs.html，引入下载的require.js，同时因测试中先使用了jquery实现，故此处将jquery-3.3.1.js同时引入

<!-- requirejs.html+module_1.js -->
<!DOCTYPE html>
<html>
    <head>
        <script type="text/javascript" src="js/jquery-3.3.1.js"></script>
        <script type="text/javascript" src="js/require.js"></script>
       <!-- <script type="text/javascript">
        $(document).ready(function(){
            $('#btn_1').click(function(){
                alert("success");
            })  
        });
        </script> --> 

         <script type="text/javascript"> 
            require(['js/module_1'],function(module){
          $('#btn_1').click(function(){
                 alert(module.click_btn()); 
            })  
        }); 

        </script>

        <link rel="stylesheet" type="text/css" href="css/login.css">
    </head>
    <body>
      <button id="btn_1" class="login-submit" >button_1</button>
      <br/><br/>
      <span>body</span>
    </body>
</html>

2、定义模块module_1.js

define(function(){  
         var click_btn = function (){ 
           return "function test";
    }
         return{
             click_btn:click_btn
         }
});

3、效果
地址栏中输入url
这里写图片描述