首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往
您找到你想要的搜索结果了吗?
是的
没有找到

基于RequireJSJQuery模块化编程——常见问题解析

不过即便是有完整官方文档,仍然遇到不少问题,比如jquery-ui使用。 下面就循序渐进讲解一下我遇到问题,以及解决办法。...关于AMDCMD理解 AMD(异步模块定义)典型就是requirejs,而CMD(通用模块定义)典型是淘宝seajs。 他们相同点是,都会异步加载js。...但是不同点是,require.js加载完会立即执行;而seajs则是等到进入主函数需要执行时才执行。...首先需要添加jquery插件依赖,这里用两个插件举例子——jquery-uijquery-datatables requirejs.config({ baseUrl: './', paths...requirejs使用jquery-ui问题 由于requirejs加载js文件后会立即执行,如果你jquery ui 插件需要刷新DOM页面,那么可能会导致页面的事件失效。

2.9K100

requireJS

这对服务器端不是一个问题,因为所有的模块都存放在本地硬盘,可以同步加载完成,等待时间就是硬盘读取时间。...但是,对于浏览器,这却是一个大问题,因为模块都放在服务器端,等待时间取决于网速快慢,可能要等很长时间,浏览器处于"假死"状态。...jsFile.js" async="true"> (2)另一个选择是将所有的脚本捆绑打包在一起,但在捆绑时候你仍然需要把它们按照正确顺序排序...', 'backbone'], function ($, _, Backbone){ // some code here }); require.js会先加载jQuery、underscorebackbone...但是实际上,虽然已经有一部分流行函数库(比如jQuery)符合AMD规范,更多库并不符合,比如underscorebackbone这两个库。

1.7K73

JS模块化编程规范1——require.js

模块化是任何一个编程语言都会支持设计,通过模块化能够将一个重要问题拆分成一个个问题,并且模块与模块之间不关联(或者弱关联),减小程序开发难度。...后来随着require.js推广使用,就逐渐形成了AMD(The Asynchronous Module Definition),也就是"异步模块加载机制"。...库,因为JQuery库是按照AMD标准规范来构建,所以可以通过require.js来引入。...require.config是用来配置导入库文件,用来给模块定义配置真正路径简短名称。...通过require方法去加载自定义数学库模块JQuery模块,其中第一个参数定义了需要加载模块;第二个参数则是加载成功之后回调函数: require(['modules'], callback)

3.2K10

JAVASCRIPT模块化3篇之三:require.js

require.js诞生,就是为了解决这两个问题: ?   (1)实现js文件异步加载,避免网页失去响应;   (2)管理模块之间依赖性,便于代码编写维护。...require()异步加载moduleA,moduleBmoduleC,浏览器不会失去响应;它指定回调函数,只有前面的模块都加载成功后,才会运行,解决了依赖性问题。...function ($, _, Backbone){     // some code here   }); require.js会先加载jQuery、underscorebackbone,然后再运行回调函数...默认情况下,require.js假定这三个模块与main.js在同一个目录,文件名分别为jquery.js,underscore.jsbackbone.js,然后自动加载。...但是实际上,虽然已经有一部分流行函数库(比如jQuery)符合AMD规范,更多库并不符合。那么,require.js是否能够加载非规范模块呢? 回答是可以

1.6K20

RequireJS极简入门教程RequireJS核心功能:HOW TOmain.js使用 shim

随着网站功能逐渐丰富,网页中js也变得越来越复杂臃肿,原有通过script标签来导入一个个js文件这种方式已经不能满足现在互联网开发模式,我们需要团队协作、模块复用、单元测试等等一系列复杂需求。...requirejs RequireJS是一个非常小巧JavaScript模块载入框架,是AMD规范最好实现者之一。RequireJS压缩后只有14K,轻量。它还同时可以其他框架协同工作。...-- JavaScript --> 属性 data-main...是告诉requirejs:你下载完require.js以后,马上去载入真正入口文件main.js。...*/ require.config({ paths: { jquery: 'libs/jquery-2.1.4.min', jqueryUi: 'libs/jquery-ui.min

1.6K30

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

这个系列第一部分第二部分,介绍了Javascript模块原型理论概念,今天介绍如何将它们用于实战。 我采用是一个非常流行require.js。 一、为什么要用require.js?...require.js诞生,就是为了解决这两个问题:   (1)实现js文件异步加载,避免网页失去响应;   (2)管理模块之间依赖性,便于代码编写维护。...require()异步加载moduleA,moduleBmoduleC,浏览器不会失去响应;它指定回调函数,只有前面的模块都加载成功后,才会运行,解决了依赖性问题。..., function ($, _, Backbone){     // some code here   }); require.js会先加载jQuery、underscorebackbone...默认情况下,require.js假定这三个模块与main.js在同一个目录,文件名分别为jquery.js,underscore.jsbackbone.js,然后自动加载。

3K60

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

这个系列第一部分第二部分,介绍了Javascript模块原型理论概念,今天介绍如何将它们用于实战。 我采用是一个非常流行require.js。...require.js诞生,就是为了解决这两个问题:   (1)实现js文件异步加载,避免网页失去响应;   (2)管理模块之间依赖性,便于代码编写维护。...require()异步加载moduleA,moduleBmoduleC,浏览器不会失去响应;它指定回调函数,只有前面的模块都加载成功后,才会运行,解决了依赖性问题。...], function ($, _, Backbone){     // some code here   }); require.js会先加载jQuery、underscorebackbone...默认情况下,require.js假定这三个模块与main.js在同一个目录,文件名分别为jquery.js,underscore.jsbackbone.js,然后自动加载。

2.1K90

JS模块化编程以及AMD、CMD规范、Webpack

目前,主要有两个Javascript库实现了AMD规范:require.jscurl.js。本系列第三部分,将通过介绍require.js,进一步讲解AMD用法,以及如何将模块化编程投入实战。...,当依赖关系很复杂时候,代码编写维护都会变得困难。...require.js诞生,就是为了解决这两个问题: (1)实现js文件异步加载,避免网页失去响应; (2)管理模块之间依赖性,便于代码编写维护。...> Webpack webpack它解决最重要问题就是这样一个问题,我们用写后端语言方式写前端代码,webpack可以做到动态把后端代码变成浏览器能够读懂代码。...参考:https://www.jianshu.com/p/fb479435eba0 Require.js使用 Require提供全局变量方法: define  是用来定义一个模块,只有实现了模块定义

2.2K10

js模块化编程之彻底弄懂CommonJSAMDCMD!(转)

因为老实说,在浏览器环境下,没有模块也不是特别大问题,毕竟网页程序复杂性有限;但是在服务器端,一定要有模块,与操作系统其他应用程序互动,否则根本没法编程。...require.js诞生,就是为了解决这两个问题:   (1)实现js文件异步加载,避免网页失去响应;   (2)管理模块之间依赖性,便于代码编写维护。...require()异步加载moduleA,moduleBmoduleC,浏览器不会失去响应;它指定回调函数,只有前面的模块都加载成功后,才会运行,解决了依赖性问题。..., function ($, _, Backbone){     // some code here   }); require.js会先加载jQuery、underscorebackbone,然后再运行回调函数...默认情况下,require.js假定这三个模块与main.js在同一个目录,文件名分别为jquery.js,underscore.jsbackbone.js,然后自动加载。

1.6K30

what is 模块化?

类似于JQuery把它暴露到window上。 引入依赖模式 如JQuery最外层,其实就是一个立即执行函数。这就是模块模式,也是现代模块实现基石。JQuery把$ jQ 添加给了window。...比如不需要轮播图模块,我们不需要引入 模块化好处 避免命名冲突(减少命名空间污染) 更好分离,按需加载 更高复用性 高可维护性 页面引入script带来问题 当我们需要引入多个js文件。...如下,如果1.js中用到jquery.js中内容,这个加载顺序是不可以换。...但是也存在一些问题,比如11排序到了2前面,因为它是按数字第一位编码排序。 commonJs基于浏览器端应用 我们上面的服务端是基于node环境去运行。...NoAMD 我们先看一下,不遵循模块化规范,也就是不使用Require.js依赖方式。

1.1K30

使用requirejs编写模块化代码

;其次,由于js文件之间存在依赖关系,因此必须严格保证加载顺序(比如上例1.js要在2.js前面),依赖性最大模块一定要放到最后加载.当依赖关系很复杂时候,代码编写维护都会变得困难。...而requirejs诞生便是为了解决这个问题。 requirejs 在官网把requirejs 下载回来之后。...使用一般方法引入: 1 但是这样方法,还是可能在加载require.js时候导致网页失去响应。...require()异步加载所需模块时候,此时浏览器并不会失去响应;当前面的模块加载成功之后,执行回调函数才会运行我们逻辑代码,因此解决了依赖性问题。 讲完了模块加载,我们下面讲一下模块编写。...AMD模块编写 require.js加载模块采用AMD规范。所以我们模块必须按照AMD规定来写。

1K50

几个常见前端模块管理器

为了解决这个问题,前端模块管理器(package management)应运而生。它可以轻松管理各种JavaScript脚本依赖关系,自动加载各个模块,使得网页结构清晰合理。...Require.js问题在于各种参数设置过于繁琐,不容易学习,很难完全掌握。而且,实际应用中,往往还需要在服务器端,将所有模块合并后,再统一加载,这多出了很多工作量。 ?...今天,我介绍另外四种前端模块管理器:Bower,Browserify,ComponentDuo。它们各自都有鲜明特点,很好地弥补了Require.js缺陷,是前端开发利器。...$ bower uninstall jquery 注意,默认情况下,会连所依赖模块一起卸载。比如,如果卸载jquery-ui,会连jquery一起卸载,除非还有别的模块依赖jquery。...Duo是在Component基础上开发,语法配置文件基本通用,并且借鉴了BrowserifyGo语言一些特点,相当地强大和好用。 首先,安装Duo。

74830

七个帮助你处理Web页面层布局jQuery插件

1.UI.Layout  jQuery UI布局插件 官方网站:http://layout.jquery-dev.com/index.cfm 使用大小可折叠嵌套面板大量选项创建高级UI布局。...布局可以创建任何你想要UI外观; 从简单标题或侧边栏到具有工具栏,菜单,帮助面板,状态栏,子表单等复杂应用程序。集成并增强其他UI部件,如选项卡,手风琴对话框,以创建丰富界面。 ?...resources/jquery-masonry 所有项目的大小样式都由您自己CSS处理。项目大小可以用响应式布局百分比来设置 ?...图片发自简书App 4.jQuery pageSlide Query pageSlide 是一个jQuery插件,它可以控制一个隐藏页面的显示关闭。...库1.7或更高版本Columns插件文件,列是将JSON数据创建为可排序,可搜索分页HTML表格简单方法。

9.3K20
领券