JavaScript实现jQuery的一些方法

1、类名选择器:$('.classname')

//获取class为classname的第一个元素(参数规则跟$()一致)
document.querySelector('.classname')
//获取class为classname的所有元素(参数规则跟$()一致)
document.querySelectorAll('.classname')
2、添加类名:addClass("active")
dom.classList.add("active");
3、移除类名:removeClass("active")
dom.classList.remove('active');
4、判断是否有类名:hasClass("active")
dom.classList.contains("active")

5、动画效果:$(".active").animate({opacity:0},function(){})

//参数:对象、属性名、原始值、变化到的值、运动时间、值的单位、结束后回调函数
function animate(dom,attr,oldValue,value,times,unit,callback) {

        var startTime=new Date().getTime();
        move();
        function move() {
            var nowTime=new Date().getTime();
            var jindu=(nowTime-startTime)/times;//进度(小数)
            if(jindu <= 1){
                dom.style[attr]=(oldValue+(value-oldValue)*jindu)+unit;
              requestAnimationFrame(move);
            }else {
                dom.style[attr]=value+unit;
                if(callback) callback();
            }
        }
    }








猜你喜欢

转载自blog.csdn.net/zhou8023ddw/article/details/80707196