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上最全的资源教程-前端涉及的所有知识体系
前面分享了前端入门资源汇总,今天分享下前端所有的知识体系. 个人站长对个人综合素质要求还是比较高的,要想打造多拉斯自媒体网站,不花点心血是很难成功的,学习前端是必不可少的一个环节, 当然你不一定要成为 ...
随机推荐
- iOS 删除黑色边框线导航栏&删除搜索框的阴影边界线和中黑色文本输入框 - 解
删除黑色边框线导航栏 in viewDidload: [self.navigationController.navigationBar setBackgroundImage:[[UIImage all ...
- Windows Phone 8 - Runtime Location API - 2
原文:Windows Phone 8 - Runtime Location API - 2 在<Windows Phone 8 - Runtime Location API - 1>介绍基 ...
- telnet模拟http訪问
HTTP协议经常使用的无非就那么几个命令 GET HEAD PUT POST 此处简单说下http的GET和HEAD 举两个简单的样例: GET的样例 telnet serverip 80 GET h ...
- Windows在结构Eclipse+Android4.0开发环境
官方搭建步骤: http://developer.android.com/index.html 搭建好开发环境之前须要下载以下几个文件包: 一.安装Java执行环境JRE(没这个Eclipse执行不起 ...
- TCP拥塞控制 (1)
Basic: TCP,传输控制协定,它是目前最广泛使用的网络传输协议.SMTP.SSH.FTP.HTTP等因特网底层协议均是TCP. TCP面向连接,提供端到端的数据可靠传输.连接时三次握手.断开是四 ...
- TFS(Team Foundation Server)简介和新手入门
在两部分的文章.我会介绍Team Foundation Server一些核心功能,着重于产品的日常应用是如何将这些功能结合使用. 作为一个软件开发.在我的职业生涯,.我常常用于支持软件开发过程中大量的 ...
- nginx lua redis 访问频率限制(转)
1. 需求分析 Nginx来处理访问控制的方法有多种,实现的效果也有多种,访问IP段,访问内容限制,访问频率限制等. 用Nginx+Lua+Redis来做访问限制主要是考虑到高并发环境下快速访问控制的 ...
- 分布式搜索elasticsearch 文献检索索引 入门
1.首先,例如,下面的数据被提交给ES该指数 {"number":32768,"singer":"杨坤","size": ...
- Singleton模式线程相关的(C\C++)
这种需求的最新发展. 我需要一个静态类,无论地方,我可以在线程中调用它public功能对应的功能已经完成. 这个静态类会调用我初始化给它的一个指针,这个指针是与线程一一相应的: 准确来说这样的模式应该 ...
- Android - 支持不同的设备 - 支持不同的屏幕
Android整体上按照两大类来分类设备屏幕:尺寸和分辨率.app在设备上运行应该考虑大小和分辨率.同样的,你应该包含不同的资源来让app适应不同的屏幕大小和分辨率. 整体上有四种尺寸:小的,正常的, ...