zoukankan      html  css  js  c++  java
  • 自己实现jquery


    (function (window) {


    //添加事件的方法通用所有
    function addevent(evetname, fn, obj) {
    if (document.attachEvent) { //ie9一下
    obj.attachEvent("on" + evetname, function () {
    fn.call(obj);
    });
    }
    else {
    obj.addEventListener(evetname, fn, false);


    }
    }

    //通过类名获得元素
    function getbyglass(classname, oparent) {

    var ss = [];
    if (!oparent) {
    oparent = document;
    }

    var elements = oparent.getElementsByTagName("*");

    if (document.getElementsByClassName) {

    ss = oparent.getElementsByClassName(classname);

    } else {
    for (var i = 0; i < elements.length; i++) {
    var obj = elements[i];
    if (obj.className == classname) {

    ss.push(obj);
    }
    }
    }
    return ss;
    }

    //得到元素的当前某个样式
    function getStyle(element, stylename) {

    if (element.currentStyle) {

    return element.currentStyle[stylename];//ie下独有 不兼容部分

    } else {

    return window.getComputedStyle(element, false)[stylename];
    }


    }

    //得到当前元素的绝对据上边距离 据下边距离
    function getOffset(element) {


    var x = element.offsetLeft;
    var y = element.offsetTop;
    if (element.parentElement != null) {
    x += element.parentElement.offsetLeft;
    y += element.parentElement.offsetTop;
    element = element.parentElement;
    }
    return { x: x, y: y };
    }


    //构造函数
    function DpQuery(context) {


    return new DpQuery.prototype.inint(context);


    }

    DpQuery.prototype.inint = function (context) {
    this.elements = [];//返回值

    var type = typeof context;

    if (type == 'function') {
    addevent('load', context, window);
    } else if (type == 'string') {

    var starts = context.substr(0, 1);//跳过0个去一个

    var svalue = context.substr(1);//跳过一个取所有

    switch (starts) {
    case "#":
    this.elements.push(document.getElementById(svalue));
    break;
    case ".":
    this.elements = getbyglass(svalue);
    break;
    default:
    this.elements = document.getElementsByTagName(context);
    break;

    }

    //return this.elements;
    } else if (type == 'object') {
    this.elements.push(context);
    }
    }

    DpQuery.prototype.inint.prototype = DpQuery.prototype;

    //原型 遍历元素
    DpQuery.prototype.each = function (fn) {

    for (var i = 0; i < this.elements.length; i++) {
    fn(i, this.elements[i]);
    }
    }

    //点击事件
    DpQuery.prototype.click = function (fn) {

    this.each(function (i, ele) {
    addevent('click', fn, ele);
    });
    return this;
    }

    //鼠标按下事件
    DpQuery.prototype.mousedown = function (fn) {
    this.each(function (i, ele) {
    addevent('mousedown', fn, ele);
    });
    return this;
    }

    //鼠标移动事件
    DpQuery.prototype.mousemove = function (fn) {
    this.each(function (i, ele) {
    addevent('mousemove', fn, ele);
    });
    return this;
    }

    //鼠标抬起事件
    DpQuery.prototype.mouseup = function (fn) {
    this.each(function (i, ele) {
    addevent('mouseup', fn, ele);
    });

    return this;
    }

    //鼠标滑上 滑出
    DpQuery.prototype.hover = function (fnover, fnout) {
    this.each(function (i, ele) {
    addevent('mouseover', fnover, ele);
    if (fnout) {
    addevent('mouseout', fnout, ele);
    }
    });
    return this;
    }

    //轮流切换
    DpQuery.prototype.toogage = function () {

    var _arguments = arguments;


    this.each(function (i, ele) {
    addevent('click', (function () {
    var count = 0;
    return function () {
    _arguments[count % arguments.length]();
    count++;
    }
    })(), ele);
    });
    }

    //获取元素样式或者设置元素样式
    DpQuery.prototype.css = function (stylename, stylevalue) {
    if (arguments.length == 2) {
    this.each(function (i, ele) {
    ele.style[stylename] = stylevalue;
    });
    } else {
    return getStyle(this.elements[0], stylename);
    }
    }

    //获取或设置属性
    DpQuery.prototype.attr = function (attrname, attrvalue) {
    if (attrvalue) {
    this.each(function (i, ele) {


    ele.setAttribute(attrname, attrvalue);
    });
    } else {

    return this.elements[0].getAttribute(attrname);

    }
    }
    //高
    DpQuery.prototype.Height = function (value) {

    if (value) {
    this.each(function (i, ele) {
    ele.style.Height = value + "px";
    });
    } else {
    return getStyle(this.elements[0], "height");
    }
    }

    //宽
    DpQuery.prototype.Width = function (value) {

    if (value) {
    this.each(function (i, ele) {
    ele.style.width = value + "px";
    });
    } else {
    return getStyle(this.elements[0], "width");
    }
    }

    //距左边距离
    DpQuery.prototype.left = function (value) {
    if (!value) {
    return getOffset(this.elements[0]).x;
    } else {
    this.elements[0].style.left = value + "px";
    return this;
    }

    }

    //距上边距离
    DpQuery.prototype.top = function (value) {
    if (!value) {
    return getOffset(this.elements[0]).y;
    } else {
    this.elements[0].style.top = value + "px";
    return this;
    }

    }

    //拖拽
    DpQuery.prototype.drag = function () {

    this.each(function (i, ele) {
    $(ele).mousedown(function (e) {


    ele.style.position = "absolute";
    ele.style["cursor"] = "pointer";

    var event = e || event;

    var disx = event.clientX - $(ele).left();

    var disy = event.clientY - $(ele).top();

    document.onmousemove = function (e) {

    var event = e || event;

    $(ele).left(event.clientX - disx);
    $(ele).top(event.clientY - disy);


    };

    document.onmouseup = function () {

    document.onmousemove = null;

    document.onmouseup = null;
    }

    return false;
    });
    });

    return this;
    }


    window.DpQuery = window.$ = DpQuery;

    })(window);

  • 相关阅读:
    洛谷 1339 最短路
    洛谷 1330 封锁阳光大学 图论 二分图染色
    洛谷 1262 间谍网络 Tarjan 图论
    洛谷 1373 dp 小a和uim之大逃离 良心题解
    洛谷 1972 莫队
    洛谷 2158 数论 打表 欧拉函数
    洛谷 1414 数论 分解因数 水题
    蒟蒻的省选复习(不如说是noip普及组复习)————连载中
    关于筛法
    关于整数划分的几类问题
  • 原文地址:https://www.cnblogs.com/fierceeagle/p/4105330.html
Copyright © 2011-2022 走看看