seaJs组建库的使用

 

原文地址：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
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！

——转载请注明该文章来源：http://www.cnblogs.com/jhmydear/
 
分类: js/jQuery

seaJs组建库的更多相关文章

  1. seaJs学习笔记2 – seaJs组建库的使用

    原文地址:seaJs学习笔记2 – seaJs组建库的使用 我觉得学习新东西并不是会使用它就够了的,会使用仅仅代表你看懂了,理解了,二不代表你深入了,彻悟了它的精髓. 所以不断的学习将是源源不断. 最 ...

  2. [转载]前端——实用UI组件库

    https://www.cnblogs.com/xuepei/p/7920888.html Angular UI 组件 ngx-bootstrap 是一套Bootstrap 组件 官网:https:/ ...

  3. 【转】前端——实用UI组件库

    Angular UI 组件 ngx-bootstrap 是一套Bootstrap 组件 官网:https://valor-software.com/ngx-bootstrap/#/ github: h ...

  4. 前端——实用UI组件库

    Angular UI 组件 ngx-bootstrap 是一套Bootstrap 组件 官网:https://valor-software.com/ngx-bootstrap/#/ github: h ...

  5. seajs模块化加载框架使用

    seajs是模块化加载框架.seajs.org已经打不开了,seajs的github.seajs速查文档 <!--如果完成下面4步,则seajs掌握了80%js模块化1.引入seajs的库 :& ...

  6. 手把手做一个基于vue-cli的组件库（上篇）

    基于vue-cli4的ui组件库,先贴个最终效果吧,步骤有点多,准备分上下篇,上篇:如何做一个初步的组件.下篇:编写说明文档及页面优化.开工. GitHub源码地址:https://github.co ...

  7. 2. web前端开发分享-css,js进阶篇

    一,css进阶篇: 等css哪些事儿看了两三遍之后,需要对看过的知识综合应用,这时候需要大量的实践经验, 简单的想法:把qq首页全屏另存为jpg然后通过ps工具切图结合css转换成html,有无从下手 ...

  8. 我们是怎么管理QQ群的

    文章背景:腾讯平台上的qq群数以千万百万计,但99%的在吹水扯蛋,从早上的问好开始,到晚上的晚安,无一不浪费青春之时间,看之痛心,无力改变,只好自己建了一个,希望能以此来改变群内交流的氛围或环境. 以 ...

  9. github上最全的资源教程-前端涉及的所有知识体系

    前面分享了前端入门资源汇总,今天分享下前端所有的知识体系. 个人站长对个人综合素质要求还是比较高的,要想打造多拉斯自媒体网站,不花点心血是很难成功的,学习前端是必不可少的一个环节, 当然你不一定要成为 ...

随机推荐

  1. Hibernate4.3.9Final常见问题汇总

    hibernate4下一个可用的hibernate.properties: jdbc.driverClassName=com.mysql.jdbc.Driver jdbc.url=jdbc:mysql ...

  2. 标准I/O缓冲：全缓冲、行缓冲、无缓冲

    说明:我仅仅对网络资源进行了整合,方便学习-.- 基于流的操作终于会调用read或者write函数进行I/O操作.为了使程序的执行效率最高,流对象一般会提供缓冲区,以降低调用系统I/O库函数的次数. ...

  3. HTTP求

    client联系server后,至server获取问题 Web 新闻资源,简称client至server发送一个 HTTP 求. 一个完整的 HTTP 该请求包含以下示例: ① ②若干消息头(请求头) ...

  4. QT 4.7.6 驱动 罗技C720摄像头

    编译器: mingw32 gcc 4.8.1 mingw32 g++ 4.8.1 QT 版本: 4.8.6 OpenCV版本: 3.0.0 测试平台: win7 x64 --------------- ...

  5. 用golang写的生成文件md5sum,检验文件md5sum

    源代码地址: https://github.com/sndnvaps/md5sum-golang

  6. HDU 1557 权利指数 国家压缩 暴力

    HDU 1557 权利指数 状态压缩 暴力 ACM 题目地址:HDU 1557 权利指数 题意:  中文题,不解释. 分析:  枚举全部集合,计算集合中的和,推断集合里面的团体是否为关键团队. 代码: ...

  7. java计算器 图形用户界面 精简版

    package com.rgy.entity; import java.awt.*; import java.awt.event.*; @SuppressWarnings("serial&q ...

  8. java编程规范之java命名规范

    想要成为一个优秀的程序员,首先要培养良好的编程习惯,为了提高代码的可读性,必须有好的命名规范. 这篇文章是小编结合网上的很多资料整理出来的,若有不当或错误的地方,欢迎大家指正 在文章开始前,为方便阅读 ...

  9. Windows PowerShell 简介

    Powershell 是运行在windows机器上实现系统和应用程序管理自动化的命令行脚本环境.微软之所以将Powershell 定位为Power,并不是夸大其词,因为它完全支持对象.其可读性,易用性 ...

  10. 构建安全的Xml Web Service系列之SSL篇

    原文:构建安全的Xml Web Service系列之SSL篇 首先介绍一下SSL, SSL 的英文全称是 "Secure Sockets Layer" ,中文名为 "安全 ...