-

xiyueta.js库原始基础框架代码(图文教程)

一个xiyueta.js库初始基础框架代码
案例预览>>

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>xiyueta.js库原始基础框架代码</title>
</head>

<body>
    <script>
    var _XIYUETA = function() {
        this.test = function(a, b, c) {
            return a + b + c
        }
    }
    var _xyt = new _XIYUETA(); 

    var xiyueta = function(config, x, y) {
        return new xiyueta.fn.init(config, x, y);
    };
    xiyueta.fn = xiyueta.prototype = {
        length: 0, //长度
        selector: "", //选择器
        domList: undefined, //找到标签列表,(这个暂时不改为[]20220415)
        x: null,
        y: null,
        domListIndex: 0 //这个有什么用,好像没有用到??20220319
    };
    //这个是引用jquery
    xiyueta.extend = xiyueta.fn.extend = function() {
        var options, name, src, copy, copyIsArray, clone,
            target = arguments[0] || {},
            i = 1,
            length = arguments.length
        if (i === length) {
            target = this;
            i--;
        }
        for (; i < length; i++) {
            if ((options = arguments[i]) != null) {
                for (name in options) {
                    copy = options[name];
                    if (name === "__proto__" || target === copy) {
                        continue;
                    }

                    if (copy !== undefined) {
                        target[name] = copy;
                    }
                }
            }
        }
        return target;
    };
    var init = xiyueta.fn.init = function(selector, x, y) {
        this.length = 0; //找到条数
        this.selector = selector; //选择器
        this.domList = []; //undefined 改为 []  因为它是数组,与jquery保持一致 20220415
        this.x = x;
        this.y = y;
        this.domListArray = []; //DOM列表数组,配合end()使用 20210925
 

        if (this.selector == undefined) this.selector = ""; //为空
    };

    init.prototype = xiyueta.fn;
    $ = $xyt = xiyueta;

    //自定义属性方法
    xiyueta.fn.extend({
        test: function(a,b,c) { //打印HTML对象全部内容 
            return _xyt.test(a,b,c)
        }
    });

  //自定义工具方法
  xiyueta.extend({
      'myFuncFour':function(){
          alert("我的自定义xiyueta方法4");
      }
  })
    console.log($().test(1,2,3))
    console.log($("abc") )
    console.log($.myFuncFour() )
    </script>
</body>

</html>