原文地址：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组建库的使用的更多相关文章

  1. seaJs学习笔记之javascript的依赖问题

    之前分别为大家介绍了有关javascript中的冲突和性能问题,今天为大家介绍一下有关javascript中的依赖问题.我们将继续就之前javascript中性能问题继续介绍. 先来回顾一下性能问题的 ...

  2. python3.4学习笔记(八) Python第三方库安装与使用，包管理工具解惑

    python3.4学习笔记(八) Python第三方库安装与使用,包管理工具解惑 许多人在安装Python第三方库的时候, 经常会为一个问题困扰:到底应该下载什么格式的文件?当我们点开下载页时, 一般 ...

  3. openresty 学习笔记六:使用session库

    openresty 学习笔记六:使用session库 lua-resty-session 是一个面向 OpenResty 的安全和灵活的 session 库,它实现了 Secure Cookie Pr ...

  4. seajs教程之seajs学习笔记 seajs.use用法

    seajs.use 用来在页面中加载模块.通过 use 方法,可以在页面中加载任意模块. 实例地址:http://www.android100.org/html/201405/23/12807.htm ...

  5. Linux学习笔记——如何使用共享库交叉编译

    0.前言     在较为复杂的项目中会利用到交叉编译得到的共享库(*.so文件).在这样的情况下便会产生下面疑问,比如:     [1]交叉编译时的共享库是否须要放置于目标板中,假设须要放置在哪个文件 ...

  6. seajs学习笔记

    seajs配置 seajs.config({ //别名配置 alias:{ 'es5-safe':'gallery/es5-safe/0.9.3/es5-safe', 'jquery':'jquery ...

  7. SeaJS学习笔记(一) ./ 和 ../ 区别

    最近要去实习,公司里使用sea.js进行模块化开发 具体下载安装就不多说了,请参见SeaJS官网 <!DOCTYPE html> <html> <head> < ...

  8. seajs 学习笔记

    seajs的作者是玉伯,具体好处优点等详见官方网址 介绍 1 模块定义define define(function(require,exports,module){ //require 引入需要的模块 ...

  9. CMD规范学习笔记——基于SEAJS实现

    CMD(Common Module Definition):该规范明确了模块的书写格式和基本交互规则.通常一个模块就是一个JS文件. 通过define关键字来定义模块,最基本的格式为: define( ...

随机推荐

  1. dotNET跨平台相关文档整理

    一直在从事C#开发的相关技术工作,从C# 1.0一路用到现在的C# 6.0, 通常情况下被局限于Windows平台,Mono项目把我们C#程序带到了Windows之外的平台,在工作之余花了很多时间在M ...

  2. Hawk 7. 常见问题

    本页面您可以通过关键字搜索来获取信息. 理性使用爬虫 爬虫是一种灰色的应用,虽然作为Hawk的设计者,但我依然不得不这么说. 各大网站都在收集和整理数据上花费了大量的精力,因此抓取的数据应当仅仅作为科 ...

  3. Redis百亿级Key存储方案（转）

    1 需求背景 该应用场景为DMP缓存存储需求,DMP需要管理非常多的第三方id数据,其中包括各媒体cookie与自身cookie(以下统称supperid)的mapping关系,还包括了supperi ...

  4. 一个诡异的COOKIE问题

    今天下午,发现本地的测试环境突然跑不动了,thinkphp直接跑到异常页面,按照正常的排错思路,直接看thinkphp的log 有一条 [ error ] [2]setcookie() expects ...

  5. Postman接口调试神器-Chrome浏览器插件

    首先大家可以去这个地址下载 Postman_v4.1.3 这个版本,我用的就是这个版本 http://chromecj.com/web-development/2014-09/60/download. ...

  6. Spring cache简单使用guava cache

    Spring cache简单使用 前言 spring有一套和各种缓存的集成方式.类似于sl4j,你可以选择log框架实现,也一样可以实现缓存实现,比如ehcache,guava cache. [TOC ...

  7. 2Sum

    用哈希表(unordered_map)使得时间复杂度从O(n*n)降到O(n),空间复杂度从O(1)增到O(n):一边找一边插入哈希表 注意 在C++11以前要使用unordered_map需要 #i ...

  8. margin折叠-从子元素margin-top影响父元素引出的问题

    正在做一个手机端电商项目,顶部导航栈的布局是一个div包含一个子div,如果给在正常文档流中的子div一个垂直margin-top,神奇的现象出现了,两父子元素的边距没变,但父div跟着一起往下走了! ...

  9. zookeeper集群的搭建以及hadoop ha的相关配置

    1.环境 centos7 hadoop2.6.5 zookeeper3.4.9 jdk1.8 master作为active主机,data1作为standby备用机,三台机器均作为数据节点,yarn资源 ...

  10. Linux自动共享USB设备：udev+Samba

    一.概述 公司最近要我实现USB设备插入Ubuntu后,自动共享到网络上,能像Windows共享一样(如\\192.168.1.10)访问里面的内容,不需要写入权限.当时听完这需求,我这新人表示惊呆了 ...