来源: 未知

发布时间: 2017-10-13

次浏览

用法:

第一步在html页面上引入JS:

第一个require.js,注意引用的时候加了一个data-main="./index",其中里面的index就是第三个引用的index.js的名字

第二个requirejs-config我们需要配上插件的路径

代码如下

// 获取基础路径

function getBaseURL() {

if (!window._baseUrl) {

var local = window.location;

var contextPath = local.pathname.split("/")[1];

//window._baseUrl = local.protocol + "//" + local.host + "/" + contextPath + "/";//加项目名:如http://localhost:8080/pro

window._baseUrl = local.protocol + "//" + local.host + "/";//不加项目名:如http://localhost:8080

}

return window._baseUrl;

};

window.CLIENT_PATH=getBaseURL();

// 基础配置

window.requireConfig = {

"baseUrl": window.CLIENT_PATH,

"paths": {

"jquery" : "assets/jquery/jquery-1.9.1",/* jquery */

"layer" : "assets/layer/layer",/*layer弹窗*/

"underscore": "assets/lodash/underscore-min",/*underscore模板*/

},

"shim": {

"layer": {

"deps": ["jquery"]

}

}

};

function require_js(name, url, deps) {

window.requireConfig["paths"][name] = url;

if (deps) {

window.requireConfig["shim"][name] = {

"deps": deps

};

}

}

//依赖前置,引用某个JS的时候把另一个提前引用一下

function require_shim(name, deps) {

if (!window.requireConfig["shim"][name]) {

window.requireConfig["shim"][name] = {

"deps": deps

};

} else {

window.requireConfig["shim"][name]["deps"] = window.requireConfig["shim"][name]["deps"].concat(deps);

}

}

//服务端地址

window._serverPath="http://xxx.xxx.xx.xx:xxxx";

第三个index.js就是程序主入口

代码如下

require_js('Config', 'require/js/config');

//执行配置

require.config(window.requireConfig);

define('index',function(require,exports,module){

var $=require('jquery');

var layer=require('layer');

var Config = require('Config');

layer.config({

path: window._baseUrl + 'assets/layer/' //layer.js所在的目录,可以是绝对目录,也可以是相对目录

});

var layerIndex = null;

var Page={

init:function(){

layer.alert(Config.a);

}

};

$(function() {//程序入口

Page.init();

});

window.Config = Config;//把常量提供到页面上

});

html引入layer.js,require.js引用jquery、layer的简单实例用法相关推荐

  1. php引入路径配置,require.js的路径配置和css的引入方法详解

    这篇文章主要介绍了详解require.js配置路径的用法和css的引入,具有一定的参考价值,感兴趣的小伙伴们可以参考一下 前端开发在近一两年发展的非常快,JavaScript作为主流的开发语言得到了前 ...

  2. jQuery Datatable 实用简单实例

    目标: 使用jQuery Datatable构造数据列表,并且增加或者隐藏相应的列,已达到数据显示要求.同时,jQuery Datatable强大的功能支持:排序,分页,搜索等. Query Data ...

  3. Require.js的基本用法详解

    一:什么是require.js ①:require.js是一个js脚本加载器,它遵循AMD(Asynchronous Module Definition)规范,实现js脚本的异步加载,不阻塞页面的渲染 ...

  4. Require.js

    前言 前段时间粗略的扫过一次require.js,当时没怎么在意,结果昨天看到index里面的代码就傻了,完全不知道从哪开始看啦,所以require与backbone的学习还要加紧才行. 由于前端所占 ...

  5. require.js基本认识

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

  6. require.js学习记录

    1.简介 官方对requirejs的描述: RequireJS is a JavaScript file and module loader. It is optimized for in-brows ...

  7. require.js的用法:

    require.js的用法: 1.作用:     1>实现js文件的异步加载,避免网页失去相应. 2>管理模块之间的依赖性,便于代码的编写和维护. 2.下载     官网下载地址:http ...

  8. Javascript模块化编程(三):require.js的用法

    这个系列的第一部分和第二部分,介绍了Javascript模块原型和理论概念,今天介绍如何将它们用于实战. 我采用的是一个非常流行的库require.js. 一.为什么要用require.js? 最早的 ...

  9. require.js基本用法

    1.require.js的加载 使用require.js的第一步,是先去官方网站下载最新版本. 下载后,假定把它放在js子目录下面,就可以加载了. 1 <script src="js/ ...

最新文章

  1. Mysql创建、删除用户
  2. ms计算机选择题,MS计算机选择题.docx
  3. Android BottomNavigation Demo
  4. spring 4.3.x_如何在Spring 3.x中使用事件
  5. Linux系统Shutdown命令定时关机详解
  6. php如何从获取数据,如何从​​获取值并保存到php的数据库
  7. 自用软件系列之:迅雷X ,无广告,纯净版
  8. vb.net 教程 3-8 窗体编程 容器 3 SplitContainer
  9. 酒店客房预订管理系统简单实现
  10. OpenCASCADE7.6编译
  11. java分库框架shard_架构组件:基于Shard-Jdbc分库分表,数据库扩容方案-Go语言中文社区...
  12. Qt Event(Qt事件)
  13. python加载模型包_R中的错误:需要h5py Python包来保存和加载模型
  14. python绘图之Times New Roman字体以及Helvetica字体
  15. 唯一分解之Pollard-Rho算法
  16. 获取淘宝价格区间l-r的商品a的详细信息(商品名等)
  17. 码农小白 设计模式篇 状态模式
  18. C#程序设计实践课程设计之数字华容道
  19. SAP如何将物料账期跨年月一次性开到当前
  20. O’Shea基于深度学习调制识别代码

热门文章

  1. 项目中出现specify @BootstrapWith‘s ‘value‘ attribute or make the default bootstrapper class avail
  2. JVM运行时内存概念-堆栈及新生代、老年代、持久代
  3. mysql加密复制_MySQL主从复制使用SSL加密
  4. 催护 ---- 题都城南庄
  5. RestTemplate返回List类型,用数组接收
  6. MySQL 快速删除大量解决方案
  7. Android开发笔记(八)神奇的shape
  8. nginx 负载均衡 最初级版本
  9. 马斯克的挖隧道公司再下一城,未来或将首次实现短途通勤
  10. SQL 个版本下载地址