seaJs学习笔记2 – seaJs组建库的使用
我觉得学习新东西并不是会使用它就够了的,会使用仅仅代表你看懂了,理解了,二不代表你深入了,彻悟了它的精髓。
所以不断的学习将是源源不断。
最近在学习seaJs和AngualrJs的指令和服务,感觉angularjs实在太强大了,好吧,步入主题,今天在深入了解seaJs的时候发现了一款神器,不过这款神奇貌似没有更新和维护了,但我测试了一下,还是可以用的。
这款神奇就是SeaJS 组件库 ,Sea.js 是一个适用于 Web 浏览器端的模块加载器。在 Sea.js 里,一切皆是模块,所有模块协同构建成模块系统。
神器DOC地址:http://panxuepeng.github.io/seajslib/
下面我们来简单的演示一下如何吧
首先你要下载本神器:https://github.com/panxuepeng/seajslib/archive/gh-pages.zip
因为它是基于seaJs,而seaJs是需要nodeJs环境的,并且本神器下载之后是需要用npm进行安装下载相关依赖的库,所以grunt你也是得下载的。
配置好环境后,执行2步,(比如你解压到seajslib文件夹下):
1、在命令行窗口进入 seajslib/lib 目录,执行 npm install shelljs。 2、在命令行窗口进入 seajslib/lib 目录,执行 node install.js ,安装 Grunt 相关模块。
然后,你就可以拷贝seajslib下的lib文件夹到你的项目中去使用了。其实你会发现其中包含了很多组建模块,我们也可以把需要的拷贝出来,而不是拷贝整个。
来个小李子,直接上代码,清晰直接:
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8" />
<script src="../lib/seajs/src/seajs.js"></script>
<script src="../lib/jquery/jquery-1.9.1.min.js"></script>
</head>
<body>
<a href="data.txt" data-toggle="dialog">预览(ajax)</a><br/>
<a href="data.txt" data-toggle="artdialog">请点击我(选择器方式拿到内容)</a>
<script>
seajs.use(['dialog/src/dialog', 'artdialog/src/artdialog']);
</script>
</body>
</html>
在上面的例子中,a标签里面的都是指向的一个文件,这就是用ajax异步请求获取data.txt的文件内容,这里我用到了2个组建,dialog,artdialog,在data-toggle中指定需要使用的组建名即可。
效果图:

这款神奇还包含了很多组建,来看看列表:

就介绍到这里吧,总会有需要用到它的时候。以此mark!
seaJs学习笔记2 – seaJs组建库的使用的更多相关文章
- seaJs学习笔记之javascript的依赖问题
之前分别为大家介绍了有关javascript中的冲突和性能问题,今天为大家介绍一下有关javascript中的依赖问题.我们将继续就之前javascript中性能问题继续介绍. 先来回顾一下性能问题的 ...
- python3.4学习笔记(八) Python第三方库安装与使用,包管理工具解惑
python3.4学习笔记(八) Python第三方库安装与使用,包管理工具解惑 许多人在安装Python第三方库的时候, 经常会为一个问题困扰:到底应该下载什么格式的文件?当我们点开下载页时, 一般 ...
- openresty 学习笔记六:使用session库
openresty 学习笔记六:使用session库 lua-resty-session 是一个面向 OpenResty 的安全和灵活的 session 库,它实现了 Secure Cookie Pr ...
- seajs教程之seajs学习笔记 seajs.use用法
seajs.use 用来在页面中加载模块.通过 use 方法,可以在页面中加载任意模块. 实例地址:http://www.android100.org/html/201405/23/12807.htm ...
- Linux学习笔记——如何使用共享库交叉编译
0.前言 在较为复杂的项目中会利用到交叉编译得到的共享库(*.so文件).在这样的情况下便会产生下面疑问,比如: [1]交叉编译时的共享库是否须要放置于目标板中,假设须要放置在哪个文件 ...
- seajs学习笔记
seajs配置 seajs.config({ //别名配置 alias:{ 'es5-safe':'gallery/es5-safe/0.9.3/es5-safe', 'jquery':'jquery ...
- SeaJS学习笔记(一) ./ 和 ../ 区别
最近要去实习,公司里使用sea.js进行模块化开发 具体下载安装就不多说了,请参见SeaJS官网 <!DOCTYPE html> <html> <head> < ...
- seajs 学习笔记
seajs的作者是玉伯,具体好处优点等详见官方网址 介绍 1 模块定义define define(function(require,exports,module){ //require 引入需要的模块 ...
- CMD规范学习笔记——基于SEAJS实现
CMD(Common Module Definition):该规范明确了模块的书写格式和基本交互规则.通常一个模块就是一个JS文件. 通过define关键字来定义模块,最基本的格式为: define( ...
随机推荐
- 微信小程序开发心得
微信小程序也已出来有一段时间了,最近写了几款微信小程序项目,今天来说说感受. 首先开发一款微信小程序,最主要的就是针对于公司来运营的,因为,在申请appid(微信小程序ID号)时候,需要填写相关的公司 ...
- java Web项目创建之一(普通java web项目的创建与发布)
1.创建新的web项目 file->new_>Dynamic Web Project(如图) 或file->new->Project->Web->Dynamic W ...
- JAVA for mac 的学习之路
要学习一门新技术,首先得下载相关的工具. 一 . 下载相关工具 1. 下载 jdk formac 下载地址为:http://www.oracle.com/technetwork/java/javase ...
- Security Policy:行级安全(Row-Level Security)
行级安全RLS(Row-Level Security)是在数据行级别上控制用户的访问,控制用户只能访问数据库表的特定数据行.断言是逻辑表达式,在SQL Server 2016中,RLS是基于安全断言( ...
- 让 windows 下的命令行程序 cmd.exe 用起来更顺手
在 Windows 下使用 Larave 框架做开发,从 Composer 到 artisan 总是避免不了和 cmd.exe 打交道,系统默认的命令行界面却是不怎么好看,且每行显示的字符数是做了限制 ...
- (JS+CSS)实现图片放大效果
代码很简单,在这里就不过多阐述,先上示例图: 实现过程: html部分代码很简单 <div id="outer"> <p>点击图片</p> &l ...
- 了不起的 nodejs-TwitterWeb 案例 bug 解决
了不起的nodejs算是一本不错的入门书,不过书中个别案例存在bug,按照书中源码无法做出和书中相同效果,原本兴奋的心情掺杂着些许失落. 现在我们看一下第七章HTTP,一个Twitter Web客户端 ...
- jQuery之Deferred源码剖析
一.前言 大约在夏季,我们谈过ES6的Promise(详见here),其实在ES6前jQuery早就有了Promise,也就是我们所知道的Deferred对象,宗旨当然也和ES6的Promise一样, ...
- 用FSM一键制作逐帧动画雪碧图 Vue2 + webpack
因为工作需要要将五六十张逐帧图拼成雪碧图,网上想找到一件制作工具半天没有找到,就自己用canvas写了一个. 写成之后就再没有什么机会使用了,因此希望有人使用的时候如果遇到bug了能及时反馈给我. 最 ...
- 微信公众号开发(一)--验证服务器地址的Java实现
现在主流上都用php写微信公众号后台,其实作为后端语言之一的java也可以实现. 这篇文章将对验证服务器地址这一步做出实现. 参考资料:1.慕课网-<初识java微信公众号开发>,2.微信 ...