zoukankan      html  css  js  c++  java
  • seaJs学习笔记2 – 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、在命令行窗口进入 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中指定需要使用的组建名即可。

    效果图:

    234242

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

    22222

    就介绍到这里吧,总会有需要用到它的时候。以此mark!

  • 相关阅读:
    python super()函数
    java中的方法
    python的5大数据类型操作之列表篇
    java流程控制
    eval函数 exec函数 compile函数之间的应用
    基础语法
    java中对字符串的操作
    iOS 简单的文件写入
    iOS弹出窗口
    iOS block传值和属性传值
  • 原文地址:https://www.cnblogs.com/jhmydear/p/4682228.html
Copyright © 2011-2022 走看看