JavaScript基础库

/**
*
*/
//通过ID获取元素

function getId(id){
    return document.getElementById(id);
}

//获取Paernt元素下面类名为class的所有元素(首先parent元素必须找到);

function getByClass(parent,oClass){
    var newArr=[];
    var oEle=parent.getElementsByTagName('*');
    for(var i=0;i<oEle.length;i++){
        if(oEle[i].className===oClass){
            mewArr.push(oEle[i]);
        }
    }
    return newArr;
}

//获取第一个子节点

function getFirstNode(ele){
    return ele.firstElementChild||ele.firstChild;
}

//获取最后一个子节点

function getLastNode(ele){
    return ele.lastElementChild||ele.lastChild;//位置不能调换,弊端:在非IE低下会执行ele.lastChild从而找到所有类型节点
}

//获取下一个兄弟节点

function getNextNode(ele){
    return ele.nextElementSibling||ele.nextSibling;
}

//获取上一个兄弟节点

function getNextNode(ele){
    return ele.previousElementSibling||ele.previousSibling;
}

//通过索引值获取对应兄弟节点

function getEleOfIndex(ele,index){
    return ele.parentNode.children[index];
}

//获取所有兄弟节点

function getSiblingAll(ele){
    var newArr=[];
    var arr=ele.parentNode.children;
    for(var i=0;i<arr.length;i++){
        if(arr[i]!==ele){
            newArr.push(arr[i]);
        }
    }
    return newArr;
}

//通过当前元素获取 上一个兄弟元素节点
//ele.previousSibling:这个方法获取的是元素的上一个节点(包括文本节点),在IE低版本这个只获取元素节点,
//ele.previousElementSibling:这个方法获取的是元素的上一个元素节点,在IE低版本没有这个方法,

function  getPre(ele){
    var pre=ele.previousSibling;
    while(pre&&pre.nodeType!=1){
        pre=pre.previousSibling;
    }
    return pre;
}

//通过当前元素获取 所有哥哥元素节点

function  getPreAll(ele){
    var array=[];
    var pre=ele.previousSibling;
    while(pre){
        if(pre.nodeType==1){
            array.unshift(pre);
        }
        pre=pre.previousSibling;
    }
    return array;
}

//通过当前元素获取 下一兄弟元素节点

function  getNex(ele){
    var nex=ele.nextSibling;
    while(nex&&nex.nodeType!=1){
        nex=nex.nextSibling;
    }
    return nex;
}

//通过当前元素获取 所有弟弟元素节点

function  getNexAll(ele){
    var array=[];
    var nex=ele.nextSibling;
    while(nex){
        if(nex.nodeType==1){
            array.push(nex);
        }
        nex=nex.nextSibling;
    }
    return array;
}

//通过当前元素获取 所有子元素节点

function getEleChild(ele){
    if(!ele.children){
        var array=[];
        var nodeList=ele.childNodes;
        for(var i=0;i<nodeList.length;i++){
            if(ele.childNodes[i].nodeType==1){
                array.push(ele.childNodes[i]);
            }
        }
        return array;
    }else{
        return ele.children;
    }
}

//获取元素属性的函数

function getStyle(obj,attr){
    if(obj.currentStyle){
        return obj.currentStyle[attr];
    }else{
        return getComputedStyle(obj)[attr];
    }
}

//封装好的运动函数

function startMover(obj,json,fnEnd){
    clearInterval(obj.timer);
    obj.timer=setInterval(function(){
        var bStop=true;
        for(var attr in json){
            var cur;
            if(attr=='opacity'){
                cur=Math.round(parseFloat(obj,attr)*100);
            }else{
                cur=parseInt(getStyle(obj,attr));
            }
            var speed=(json[attr]-cur)/6;
            speed=speed>0?Math.ceil(speed):Math.floor(speed);
            if(cur!=json[attr])bStop=false;
            if(attr='opacity'){
                obj.style.filter = 'alpha(opacity='+(cur+speed)+')';
                obj.style.opacity=(cur+speed)/100;
            }else{
                obj.style[attr]=cur+speed+'px';
            }
        }
        if(bStop){
            clearInterval(obj.timer);
            if(fnEnd)fnEnd();
        }
    },30);
}

//事件绑定
//addEventLisener:事件处理程序会在当前对象的作用域运行,因此,事件处理程序的this就是当前对象
//attachEvent:事件处理程序是在全局作用域下运行因此this就是window

function addHandler(ele,type,fn){  //ele元素名 type字符串事件 fn函数
    if(ele.addEventListener){
        ele.addEventListener(type,fn,false);//false换为true就是捕获//
    }else if(ele.attachEvent){
        ele.attachEvent('on'+type,fn);//IE下
    }else{
        ele['on'+type]=fn;
    }
}

//移除事件

function removeHandler(ele,type,fn){
    if(ele.removeEventListener){
        ele.removeEventListener(type,fn,false);
    }else if(ele.detachEvent){
        ele.detachEvent('on'+type,fn);//IE
    }else{
        ele['on'+type]=null;
    }
}

//获取event

function getEvent(ev){
    return ev?ev:event;
    //var event = event || window.event;
}

//获取Target(事件源)在事件内调用

function getTarget(ev){
    var oEvent=ev||event;
    return oEvent.target||oEvent.srcElement;
}

//阻止默认行为

function preventDefault(ev){
    var oEvent=ev||event;
    if(oEvent.preventDefault){
        oEvent.preventDefault(); 
    }else{
        oEvent.returnValue=false;//IE
    }
    //return false//JQ zepto时他会把冒泡和捕获都 阻止
}

//阻止事件传播/事件流

function stopPropagation(ev){
    var oEvent=ev||event;
    if(oEvent.stopPropagation){
        oEvent.stopPropagation();
    }else{
        oEvent.cancelBubble=true;
    }
}

//获取可视区宽度和高度

function getBody(){
    var sw=document.body.scrollWidth||document.documentElement.scrollWidth;
    var sh=document.body.scrollHeight||document.documentElement.scrollHeight;
    return {sw,sh};
}

//获取鼠标坐标

function getMouse(ev){
    var oEvent=ev||event;
    var st=document.body.scrollTop||document.documentElement.scrollTop;
    var sl=document.body.scrollLeft||document.documentElement.scrollLeft;
    return {x:oEvent.clientX+sl,y:oEvent.clientY+st}
}

//clientX/clientY 所有浏览器都支持,窗口位置
//pageX/pageY IE8以前不支持,页面位置
//screenX/screenY 屏幕位置
//shiftKey/ctrlKey/altKey 同时按下组合键

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值