介绍

RequireJS是一个非常小巧的JavaScript模块载入框架,是AMD规范最好的实现者之一。最新版本的RequireJS压缩后只有14K,堪称非常轻量。它还同时可以和其他的框架协同工作,使用RequireJS必将使您的前端代码质量得以提升。

特点

  1. 模块化加载
  2. 防止js加载阻塞页面渲染
  3. 使用程序调用的方式加载js,代码更美观

基本用法

正常使用

index.html

<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="app.js"></script>
</head>
<body>
<span>body</span>
</body>
</html>

app.js

function fun1(){
alert("it works");
} fun1();

requirejs用法

先下载requirejs代码包,然后按照下面的方法引用

index.html

<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="require.js"></script>
<script type="text/javascript">
require(["app"]);
</script>
</head>
<body>
<span>body</span>
</body>
</html>

app.js

define(function(){
function fun1(){
alert("it works");
} fun1();
})

此时打开页面,发现弹出it works,说明调用成功了,然后发现这个requirejs调用还有一个好处就是,解决了js加载阻塞问题。

相关链接:

  1. requirejs菜鸟教程
  2. requirejs官网

requirejs教程(一):基本用法的更多相关文章

  1. php中的curl使用入门教程和常见用法实例

    摘要: [目录] php中的curl使用入门教程和常见用法实例 一.curl的优势 二.curl的简单使用步骤 三.错误处理 四.获取curl请求的具体信息 五.使用curl发送post请求 六.文件 ...

  2. 【转】JS模块化工具requirejs教程(二):基本知识

    前一篇:JS模块化工具requirejs教程(一):初识requirejs 我们以非常简单的方式引入了requirejs,这一篇将讲述一下requirejs中的一些基本知识,包括API使用方式等. 基 ...

  3. 【转】JS模块化工具requirejs教程(一):初识requirejs

    随着网站功能逐渐丰富,网页中的js也变得越来越复杂和臃肿,原有通过script标签来导入一个个的js文件这种方式已经不能满足现在互联网开发模式,我们需要团队协作.模块复用.单元测试等等一系列复杂的需求 ...

  4. 菜鸟requireJS教程---2、基本知识

    菜鸟requireJS教程---2.基本知识 一.总结 一句话总结: 1.requireJS中的api就define(比如定义自己的函数)和require 2.requireJS使用的话就是配置req ...

  5. 菜鸟requireJS教程---1、初识requirejs

    菜鸟requireJS教程---1.初识requirejs 一.总结 一句话总结: Using a modular script loader like RequireJS will improve ...

  6. requireJS教程

    目录[-] 使用 RequireJS 优化 Web 应用前端 AMD 简介 传统 JavaScript 代码的问题 AMD 的引入 清单 1. AMD 规范 RequireJS 简介 实战 Requi ...

  7. 【requirejs】JS模块化工具requirejs教程

    初识requirejs 随着网站功能逐渐丰富,网页中的js也变得越来越复杂和臃肿,原有通过script标签来导入一个个的js文件这种方式已经不能满足现在互联网开发模式,我们需要团队协作.模块复用.单元 ...

  8. JS模块化工具requirejs教程(二):基本知识

    基本API require会定义三个变量:define,require,requirejs,其中require === requirejs,一般使用require更简短 define 从名字就可以看出 ...

  9. JS模块化工具requirejs教程(一):初识requirejs

    随着网站功能逐渐丰富,网页中的js也变得越来越复杂和臃肿,原有通过script标签来导入一个个的js文件这种方式已经不能满足现在互联网开发模式,我们需要团队协作.模块复用.单元测试等等一系列复杂的需求 ...

随机推荐

  1. CMakeListx.txt 编辑语法学习

    已hello.cpp为源文件,构建一个CMakeLists.txt cmake_minimum_required(VERSION 2.8) project(hello) add_executable( ...

  2. [Vue] Conditionally Render DOM Elements in Vue.js (v-if v-else v-show)

    You can use v-if and v-else to display content based on assertions on your data. Similarly, v-show c ...

  3. Android注冊短信验证码功能

    一.短信验证的效果是通过使用聚合数据的SDK实现的 ,效果例如以下: 二.依据前一段时间的博客中输了怎么注冊! 注冊之后找到个人中心找到申请一个应用就可以! 三.依据官方文档创建项目 官方文档API下 ...

  4. Git Push问题remote: hooks/update:10 undefined method &#39;require_relative&#39; for main:Object(NomethodError)

    今天在提交代码时遇到到了一个非常蛋疼的问题,remote: hooks/update:10 undefined method 'require_relative' for main:Object(No ...

  5. epoll 和select

    epoll 水平触发和边缘触发的区别 EPOLLLT——水平触发EPOLLET——边缘触发 epoll有EPOLLLT和EPOLLET两种触发模式,LT是默认的模式,ET是“高速”模式.LT模式下,只 ...

  6. Mac下新安装的MySQL无法登陆root用户(安装时没有设置密码)

    1.也不知是何原因,新安装好的MySQL,如果尝试用mysql -u root -p登陆就会出现这样的错误,但是root用户根本就没有设置密码. $ cd /usr/local$ cd mysql $ ...

  7. 机房重构所遇问题&quot;未能载入文件或程序集“DAL”或它的某一个依赖项。系统找不到指定的文件&quot;的解决的方法集锦

    敲七层登录的时候.忽然间认为敲三层搞清的思路瞬间又凌乱了.花了一天的时间边敲边梳理,最终整完了,执行的时候弹出了这种错误:未能载入文件或程序集"DAL"或它的某一个依赖项. 系统找 ...

  8. hbase 配置高可用hmaster

    1.先停掉hbase bin/stop-hbase.sh 2.在hbase的conf目录下创建 backup-masters 添加hadoop003 3.分发 4.重新启动hbase并查看 bin/s ...

  9. bootstrap 模态框 video视频测试

    链接:https://files.cnblogs.com/files/tele-share/%E8%A7%86%E9%A2%91%E6%B5%8B%E8%AF%95.7z <!DOCTYPE h ...

  10. 更新edmx文件 无法生成模型:“System.Data.StrongTypingException: 表“TableDetails”中列“IsPrimaryKey”的值为 DBNull

    使用EF DBFirst 更新模型的时候,提示的错误,这是VS的EF 引用MYSQL产生的错误,如下图: 解决方案: 1.win+R 打开运行窗口,输入services.msc 回车,然后找到MySQ ...