layui 源碼分析


   //入口1  ################################################
        /*
        調用
      layui.config({
            version: "2.0.8",
            base: '/larryms/',  //實際使用時,建議改成絕對路徑
            //mods:'index',
            rightMenu: true // false關閉,設置為custom時使用自定義,不使用默認menu
        })
        */
        //該方法是 傳遞的對象 增加到 o 對象上;
        n.prototype.config = function (e) {
            for (var t in e) {
                var z = t; //t為屬性名
                var z1 = e[t]; //z1為屬性值
            }

            e = e || {};
            for (var t in e)
                o[t] = e[t];
            return this
        }
        ,
        n.prototype.modules = function () {
            var e = {};
            for (var t in u)
                e[t] = u[t];
            return e
        }(),
        //入口2  ################################################
        /*
        調用
        layui.extend({
            larry: 'js/base'
        })
        */
        //該方法是  在擴展屬性modules上增加 屬性和值;
        n.prototype.extend = function (e) {
            var t = this;
            e = e || {};
            for (var o in e)
                t[o] || t.modules[o] ? i("模塊名 " + o + " 已被占用") : t.modules[o] = e[o];
            return t
        }
        //入口3  ###############################################
        /*
        調用
             layui.use('larry');
        */
        n.prototype.use = function (e, n, l) {
            //定義一個函數s ; 有可能是加載完成后在移除
            
            function s(e, t) {
                var n = "PLaySTATION 3" === navigator.platform ? /^complete$/ : /^(complete|loaded)$/;
                ("load" === e.type || n.test((e.currentTarget || e.srcElement).readyState)) && (o.modules[f] = t,
                    d.removeChild(v),
                    function r() {
                        return ++m > 1e3 * o.timeout / 4 ? i(f + " is not a valid module") : void (o.status[f] ? c() : setTimeout(r, 4))
                    }())
            }
            //定義一個函數c
            function c() {
                l.push(layui[f]),
                    e.length > 1 ? y.use(e.slice(1), n, l) : "function" == typeof n && n.apply(layui, l)
            }

            var y = this;
            var p = o.dir = o.dir ? o.dir : r; //  最后 p ="http://localhost:62081/larryms/layui/"
            //獲取head元素
            var d = t.getElementsByTagName("head")[0];
            //判斷 e是否是字符串類型, 如果是, 把 e = 該字符串的數組 [e];
            e = "string" == typeof e ? [e] : e;
            //jq對象定義的時候執行 該句
            window.jQuery && jQuery.fn.on && (
                y.each(e,
                    function (t, o) { "jquery" === o && e.splice(t, 1) }
                ),
                layui.jquery = layui.$ = jQuery
            );

            //e = ["larry"]; e[0] = "larry";
            var f = e[0], m = 0;

            if (
                l = l || [],
                o.host = o.host
                || (p.match(/\/\/([\s\S]+?)\//)
                    || ["//" + location.host + "/"])[0],
                0 === e.length || layui["layui.all"]
                &&
                u[f] || !layui["layui.all"]
                &&
                layui["layui.mobile"]
                &&
                u[f]
            ) {
                return c(), y;
            }

            if (o.modules[f])
                //立即調用函數;
                !function g() {
                    return ++m > 1e3 * o.timeout / 4 ? i(f + " is not a valid module") : void ("string" == typeof o.modules[f] && o.status[f] ? c() : setTimeout(g, 4))
                }();
            else {
                //創建一個script標簽
                var v = t.createElement("script");
                //js的路徑;  u是模塊對象
                var h = (u[f] ? p + "lay/" : /^\{\/\}/.test(y.modules[f]) ? "" : o.base || "")
                    + (y.modules[f] || f)
                    + ".js";
                //js路徑處理
                h = h.replace(/^\{\/\}/, "");
                // 瀏覽器會異步的下載該文件;加載完成 並執行
                v.async = !0;
                v.charset = "utf-8";
                //設置 script 標簽的 src
                v.src = h + function () {
                    var e = o.version === !0
                        ? o.v || (new Date).getTime()
                        : o.version || "";
                    return e ? "?v=" + e : ""
                }();

                // 該節點 追加到head 中
                d.appendChild(v);

                var zzz = !v.attachEvent;

                var zzz2 = a;

                !v.attachEvent || v.attachEvent.toString && v.attachEvent.toString().indexOf("[native code") < 0 || a
                    ? v.addEventListener("load", function (e) {
                        s(e, h)  //執行s函數
                    }, !1)
                     //IE元素 只支持 onreadystatechange事件
                    : v.attachEvent("onreadystatechange", function (e) {
                        s(e, h) //執行s函數
                    });

                o.modules[f] = h;
            }
            return y
        }

//內部 屬性

        , n = function () {
            this.v = "2.4.5"
        }
        ,//r是自執行函數;是獲得js 的路徑
        r = function () {
            //t是document;
            //t.currentScript表示正在運行的script元素
            var test = t.currentScript;
            var e = t.currentScript ? t.currentScript.src : function () {
                //document.scripts 表示獲取所有script元素集合
                for (var e,
                    o = t.scripts, n = o.length - 1, r = n; r > 0;
                    r--)
                    if ("interactive" === o[r].readyState) {
                        e = o[r].src;
                        break
                    }
                //如果e 未定義 返回.src;否則返回e;
                return e || o[n].src
            }();
            //截取字符串;獲取加載路徑;
            //src: "http://localhost:62081/larryms/layui/layui.js"
            //r = "http://localhost:62081/larryms/layui/
            return e.substring(0, e.lastIndexOf("/") + 1)
        }()

 

 

other 

o對象
o = {
            modules: {},
            status: {},
            timeout: 10,
            event: {}
        }
n.prototype.cache = o;   擴展屬性cache=o;對象
layui對象下的cache屬性
cache:
callback: {}
event: {}
modules: {}
status: {}
timeout: 10
__proto__: Object
多了一個callback屬性;
     o.callback = {},
        (function (e) {
            var o = {
                modules: {}
            }, n = function () { };
            n.prototype.cache = o;
            n.prototype.fun =function ()
            {
                var t =o;
            }
            o.callback = {};
            e.layui = new n
        })(window)

        //  類似於 o 內部變量地址 賦值 給擴展屬性 cache;
        //操作 layui.cache實際是操作 內部變量 o;
        var z = layui;
        layui.cache.AAAAAAA = 0;
        layui.fun();

o對象下的屬性
1.    callback: {}
2.    event: {}
3.    homeUrl: "console.html"
4.    menuData: {code: 1, msg: "success", data: Array(4)}
5.    modules: {}
6.    page: "switchs,index"
7.    status: {}
8.    timeout: 10
如果對 layui的cache 賦值; 實際上是賦值到o對象上;

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM