• seajs hello world


    http://localhost/seajs/index.html

    <!doctype html>
    <head>
    <title>Hello Seajs</title>
        <script src="sea.js"></script>
        <script>
            seajs.config({
              // 调试模式
              debug: true,
              // Sea.js 的基础路径
              base: 'http://localhost/seajs/app',
              // 别名配置
              alias: {
                    "jquery": "jquery/jquery"
              },
              // 文件编码
              charset: 'utf-8'
            });
        </script>
        <script>
                //执行模块
                seajs.use("app.js"); 
        </script>
    
    </head>
    <body>
        <div id="hello-seajs" >Hello SeaJS</div>
    </body>
    </html>

    http://localhost/seajs/app/jquery/jquery.js

    http://localhost/seajs/app/app.js

    define(function(require,exports,module){
        var $ = require("jquery");
         // 引入util模块的接口
         var util = require('./util');
         //var helloSeaJS = document.getElementById('hello-seajs');
         // 调用接口的方法
         //helloSeaJS.style.color = util.randomColor();
         var helloSeaJS = $("#hello-seajs");
         helloSeaJS.css("color",util.randomColor());
    });

    http://localhost/seajs/app/util.js

    define(function(require,exports,module){
         var util = {};    
         var colorRange = ['0','1','2','3','4','5','6','7','8','9','A','B','C','D','E','F'];
         util.randomColor = function(){
              return '#' +
                   colorRange[Math.floor(Math.random() * 16)] +
                   colorRange[Math.floor(Math.random() * 16)] +
                   colorRange[Math.floor(Math.random() * 16)] +
                   colorRange[Math.floor(Math.random() * 16)] +
                   colorRange[Math.floor(Math.random() * 16)] +
                   colorRange[Math.floor(Math.random() * 16)];
         };
         module.exports = util;
    });
    base添加规则
    • 完整的绝对路径 不会加base

    • 以 "." 开头 会相对于当前(被调用的)模块解析地址。 如果不存在被调用的模块(如seajs.use() ), 则会相对于当前页面解析地址。

    • 以 "/" 开头 相对于当前页面的根目录 解析地址

    • 普通命名 直接加上base前缀

    base值
    • base 默认值是 seajs所在目录

    • seajs.config()中base的解析与ID命名解析规则相同

    例如:

    http://example.com/test/js/sea/sea.js

    http://example.com/test/index.html

    在index.html中调用了sea.js

    base的默认值为 "http://example.com/test/js/sea/"

    如果使用seajs.config()设置了base

    seajs.config({
        base: "home"  // base值为 "http://example.com/test/js/sea/home"
    });
    
    seajs.confg({
        base: "./home"  // base值为 "http://example.com/test/home"
    });
    
    seajs.conifg({
        base: "/home"   // base值为 "http://example.com/home"
    });
  • 相关阅读:
    佛教哲学 学习笔记 01-我愿为十方人做桥
    动手学python之python基础:标识符,注释及缩进
    动手学python系列序言
    基于深度学习的目标检测综述(一):简介及骨干网络
    软件项目风险管理
    axure
    软件项目管理
    软件测试方法
    期中总结
    UML图相关
  • 原文地址:https://www.cnblogs.com/jami918/p/4390630.html
Copyright © 2020-2023  润新知