require.js的使用方法详细介绍-js教程-PHP中文网

require.js的使用方法详细介绍

php中世界最好的语言

发布： 2017-12-30 16:22:13

原创

2771人浏览过

我们知道，requirejs是一个非常小巧的javascript模块载入框架，是amd（asynchronous module definition，异步模块加载机制）规范最好的实现之一。最新版的requirejs压缩后只有14k，堪称非常轻量。它还同时可以和其他的框架协调工作，使用requirejs必将使我们的前端代码质量得以提升。

首先我们先来看一下一个普通的页面js加载

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title></title>
    <script type="text/javascript" src="js/index02.js" ></script>
  </head>
  <body>
    <h1>this is a page.</h1>
  </body>
</html>

登录后复制

此时，如果我们不对弹出框做操作，页面就不会接着加载，就不会有页面内容，这并不是我们想要实现的结果。

下面我们用require.js进行操作：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title></title>
    <script src="js/require2.1.11.js"></script>
    <script type="text/javascript">
      require(["js/index","js/index01"],function(){
        console.log("当js加载成功后会执行的函数");
      },function(){
        console.log("当js加载失败后会执行的函数");
      });
    </script>
  </head>
  <body>
  </body>
</html>

登录后复制

index.js

define(function(){
  console.log("this is a test!");
  function test(){
    console.log("haha,i am a test!");
  }
  test();
});

登录后复制

相信看了以上介绍你已经掌握了方法，更多精彩请关注php中文网其它相关文章！

品杰电子商务购物平台系统

网上购物商城，它属于BtoC电子商务网站平台，它能够直接绕过中介（如批发商、销售商或经销商）建立与客户的直接关系。该网站可以为用户提供商品的详细信息，用户可以在线购买商品，确定镇定的订单；同时提供关于商品或电子零销商的选择建议等等。网上购物平台使得人们的购买变的更方便、更加容易。前台功能模块有：热销商品订单管理购物车结算中心注册会员　　用户登录