seaJs组建库
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
2
3
|
1、在命令行窗口进入 seajslib/lib 目录,执行 npm install shelljs。 2、在命令行窗口进入 seajslib/lib 目录,执行 node install.js ,安装 Grunt 相关模块。 |
然后,你就可以拷贝seajslib下的lib文件夹到你的项目中去使用了。其实你会发现其中包含了很多组建模块,我们也可以把需要的拷贝出来,而不是拷贝整个。
来个小李子,直接上代码,清晰直接:
|
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
|
<!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组建库的更多相关文章
- seaJs学习笔记2 – seaJs组建库的使用
原文地址:seaJs学习笔记2 – seaJs组建库的使用 我觉得学习新东西并不是会使用它就够了的,会使用仅仅代表你看懂了,理解了,二不代表你深入了,彻悟了它的精髓. 所以不断的学习将是源源不断. 最 ...
- [转载]前端——实用UI组件库
https://www.cnblogs.com/xuepei/p/7920888.html Angular UI 组件 ngx-bootstrap 是一套Bootstrap 组件 官网:https:/ ...
- 【转】前端——实用UI组件库
Angular UI 组件 ngx-bootstrap 是一套Bootstrap 组件 官网:https://valor-software.com/ngx-bootstrap/#/ github: h ...
- 前端——实用UI组件库
Angular UI 组件 ngx-bootstrap 是一套Bootstrap 组件 官网:https://valor-software.com/ngx-bootstrap/#/ github: h ...
- seajs模块化加载框架使用
seajs是模块化加载框架.seajs.org已经打不开了,seajs的github.seajs速查文档 <!--如果完成下面4步,则seajs掌握了80%js模块化1.引入seajs的库 :& ...
- 手把手做一个基于vue-cli的组件库(上篇)
基于vue-cli4的ui组件库,先贴个最终效果吧,步骤有点多,准备分上下篇,上篇:如何做一个初步的组件.下篇:编写说明文档及页面优化.开工. GitHub源码地址:https://github.co ...
- 2. web前端开发分享-css,js进阶篇
一,css进阶篇: 等css哪些事儿看了两三遍之后,需要对看过的知识综合应用,这时候需要大量的实践经验, 简单的想法:把qq首页全屏另存为jpg然后通过ps工具切图结合css转换成html,有无从下手 ...
- 我们是怎么管理QQ群的
文章背景:腾讯平台上的qq群数以千万百万计,但99%的在吹水扯蛋,从早上的问好开始,到晚上的晚安,无一不浪费青春之时间,看之痛心,无力改变,只好自己建了一个,希望能以此来改变群内交流的氛围或环境. 以 ...
- github上最全的资源教程-前端涉及的所有知识体系
前面分享了前端入门资源汇总,今天分享下前端所有的知识体系. 个人站长对个人综合素质要求还是比较高的,要想打造多拉斯自媒体网站,不花点心血是很难成功的,学习前端是必不可少的一个环节, 当然你不一定要成为 ...
随机推荐
- W5500 keep-alive的用途及使用
大家是否遇到过这种问题,W5500作为server已经建立连接,突然网线掉了,然后再去连接W5500.就连不上了. 为什么?以下对这个问题进行解释说明,并提出解决的方法. 图1中的上位机程序作为cli ...
- javascript从定义到执行 js引擎 闭包
javascript从定义到执行,JS引擎在实现层做了很多初始化工作,因此在学习JS引擎工作机制之前,我们需要引入几个相关的概念:执行环境 栈.全局对象.执行环境.变量对象.活动对象.作用域和作用域链 ...
- 在 VS 类库项目中 Add Service References 和 Add Web References 的区别
原文:在 VS 类库项目中 Add Service References 和 Add Web References 的区别 出身问题: 1.在vs2005时代,Add Web Reference(添加 ...
- HDU 1711 Number Sequence(算法验证)
该怎么做.每一个人的人生都应该自己掌握.你给不了别人一切.你也不懂别人的忧伤. 微笑不代表快乐.哭泣不一定悲伤 不努力怎么让关心你的人幸福.不努力怎么让看不起你的人绝望. 我用生命在奋斗--lx_Zz ...
- 信息二战炸弹:中国到美国咨询公司Say no
疯抢/文 在禁止Windows8操作系统參与政府採购,以及在中国销售的全部外国IT产品和服务都须通过新的安全审查之后,英国<金融时报>今天报料中国已禁止国企使用美国咨询公司服务. 这则消息 ...
- 了解HTML5和“她”的 API (三)
Web Workers(后台线程) JavaScript是单线程的,较长的javascript运算会阻塞UI线程. web worker 是运行在后台的 JavaScript,不会影响页面的性能. 在 ...
- 小代码编写神器:LINQPad 使用入门
原文:小代码编写神器:LINQPad 使用入门 一:概述 1:想查看程序运行结果,又不想启动 VS 怎么办? 2:想测试下自己的 C# 能力,不使用 VS 的智能感知,怎么办? 那么,我们有一个选择, ...
- mysql语句中使用like后面的%(百分号)的问题
问题:mysql语句中使用like后面的%(百分号) 是不是越多运行效率越慢! 总用时:0.0489秒 0.0691 0.0485 0.0467 SELECT `goods_name`, `goods ...
- JAVA在IO流量汇总
本文是在学习中的总结,欢迎转载但请注明出处:http://blog.csdn.net/pistolove/article/details/42119261 我想你对JAVA的IO流有所了解,平时使用的 ...
- NuttX 介绍
(嵌入式 实时操作系统 rtos nuttx 7.1) NuttX 介绍 转载请注明出处:http://blog.csdn.net/zhumaill/article/details/24197637 ...