我的js工具库

//查看滚动条的滚动距离
function getScrollOffset() {
    if (window.pageXOffset) {
        return {
            x: window.pageXOffset,
            y: window.pageYOffset
        }
    } else {
        return {
            x: document.body.scrollLeft + document.documentElement.scrollLeft,
            y: document.body.scrollTop + document.documentElement.scrollTop
        }
    }
}
//求可视化窗口的尺寸
function getViewportOffset() {
    if (window.innerWidth) {
        return {
            w: window.innerWidth,
            h: window.innerHeight
        }
    } else {
        if (document.compatMode === "BackCompat") {
            return {
                w: document.body.clientWidth,
                h: document.body.clientHeight
            }
        } else {
            return {
                w: document.documentElement.clientWidth,
                h: document.documentElement.clientHeight
            }
        }
    }
}
//获取外部CSS样式
function getStyle(elem, prop) {
    if (window.getComputedStyle) {
        return window.getComputedStyle(elem, null)[prop];
    } else {
        return elem.currentStyle[prop];
    }
}
//修改外部CSS样式属性 + 获取外部CSS样式
function changeCss(elem, attr, value) {
    if (arguments.length == 2) {
        return getStyle(elem, attr);
    } else {
        if (arguments.length == 3) {
            elem.style[attr] = value;
        };
    };
};
//给标签添加事件
function addEvent(elem, type, handle) {
    if (elem.addEventListener) {
        elem.addEventListener(type, handle, false)
    } else if (elem.attachEvent) {
        elem.attachEvent('on' + type, function () {
            handle.call(elem);
        })
    } else {
        elem['on' + type] = handle;
    }
}
//取消事件绑定
function removeEvent(elem, type, func) {
    if (elem.removeEventListener) {
        elem.removeEventListener(type, func, false);
    } else if (elem.detachEvent) {
        elem.detachEvent('on' + type, func);
    } else {
        elem['on' + type] = null;
    }
}
//取消事件冒泡函数
function stopBubble(event) {
    if (event.stopPropagation) {
        event.stopPropagation();
    } else {
        event.cancelBubble = true;
    }
}
//阻止默认事件
function cancelHandler(event) {
    if (event.preventDefault) {
        event.preventDefault();
    } else {
        event.returnValue = flase;
    }
}
//方块拖拽方法
function drag(elem) {
    var disX,
        disY;
    addEvent(elem, 'mousedown', mouseDown);
    addEvent(elem, 'mouseup', mouseUp);
    function mouseDown(e) {
        var event = e || window.event;
        disX = event.pageX - parseInt(getStyle(elem, 'left'));
        disY = event.pageY - parseInt(getStyle(elem, 'top'));
        addEvent(document, 'mousemove', mouseMove);
        stopBubble(event);
        cancelHandler(event);
    }
    function mouseMove(e) {
        var event = e || window.event;
        changeCss(elem, "left", event.pageX - disX + 'px');
        changeCss(elem, 'top', event.pageY - disY + 'px');
    }
    function mouseUp() {
        document.removeEventListener('mousemove', mouseMove, false);
    }
}
//斐波那契数列
function fibonacci(n) {
    if (n == 1) {
        return 0;
    } else if (n == 2) {
        return 1;
    } else {
        return fibonacci(n - 1) + fibonacci(n - 2);
    }
}
//创建二维数组
function tdA() {//思路就是在数组里面创建数组
    var arr = [];
    var count = 0;
    for (var i = 0; i < 5; i++) {
        var newArr = [];
        for (var j = 0; j < 5; j++) {
            newArr.push(++count);
        }
        arr.push(newArr);
    }
}
//search 属性获取 ?ie=UTF-8&wd=%E5%AD%A6%E4%B9%A0%E9%80%9A
//这种是获取键对数组,不用传参
function getsearchValue1() {
    var str;
    var arr = [],
        newArr = [];
    str = location.search.substring(1);
    arr = str.split('&');
    var n = arr.length;//位置不能放在上面
    for (var i = 0; i < n; i++) {
        newArr[i] = arr[i].split('=');
    }
    return newArr;
}
//这种是可以直接查询,需要传参
function getsearchValue2(key) {
    var search = location.search.substring(1);
    var star = search.indexOf(key);
    if (star != -1) {
        var end = search.indexOf('&', star);
        if (end == -1) {
            end = search.length;
        }
    } else {
        alert('检索中不存在该属性!');
    }
    var arr = [];
    arr = search.substring(star, end).split('=');
    return arr[1];
}
//方块匀速运动(前提是运动的元素设置定位)
function move(elem) {
    var speedX = 6;
    var speedY = 3;
    setInterval(function () {//setInterval默认无参数,加了报错!
        var left = parseInt(getStyle(elem, 'left'));
        var width = parseInt(getStyle(elem, 'width'));
        var top = parseInt(getStyle(elem, 'top'));
        var height = parseInt(getStyle(elem, 'height'));
        if (left > window.innerWidth - width || left < 0) {
            speedX *= -1;
        }//碰撞弹回
        if (top > window.innerHeight - height || top < 0) {
            speedY *= -1;
        }//碰撞弹回
        changeCss(elem, 'left', left + speedX + 'px');
        changeCss(elem, 'top', top + speedY + 'px');
    }, 20);
}
//渐变的动画特效(运动,透明度,大小)
function animate(elem, properties) {//透明度的目标参数要用50代表0.5!
    clearInterval(elem.timer);//这里不把timer设置为元素的属性后边做透明轮播会出错
    elem.timer = setInterval(function () {
        for (var property in properties) {//遍历枚举
            var current
            var target = properties[property];//表示target是对象的一个属性的属性值
            if (property === 'opacity') {
                current = Math.round(parseFloat(changeCss(elem, 'opacity')) * 100);
            } else {
                current = parseInt(changeCss(elem, property));
            }
            var speed = (target - current) / 30;
            speed = speed > 0 ? Math.ceil(speed) : Math.floor(speed);
            if (property === 'opacity') {
                var end = (current + speed) / 100;
                changeCss(elem, property, end);
            } else {
                changeCss(elem, property, current + speed + 'px');
            }
        }
    }, 20)
}// animate(box1, {width: 200, left: 600, opacity: 50});具体调用,注意opacity的数值
//异步加载js
function loadScript(url, callback) {
    var script = document.createElement('script');
    script.type = "text/javascript"
    if (script.readyState) {
        script.onreadystatechange = function () {
            if (script.readyState == 'complete' || script.readyState == 'loaded') {
                callback();
            }
        }
    } else {
        script.onload = function () {
            callback();
        }
    }
    script.src = url;//写在if后面
    document.head.appendChild(script);
}
//设置cookie
function setCookie(name, value, day) {
    var oDate = new Date();
    oDate.setDate(oDate.getDate() + day);
    document.cookie = name + '=' + value + ';expires' + oDate;
}
//获取cookie
function getCookie(name) {
    var str = document.cookie;
    var arr = str.split('; ');
    for (var i = 0; i < arr.length; i++) {
        var newarr = arr[i].split('=');
        if (newarr[0] == name) {
            return newarr[1];
        }
    }
}
//删除cookie
function removeCookie(name) {
    setCookie(name, 1, -1);
}
//随机生成颜色代码
function rgbColor() {
    let r = Math.floor(Math.random() * 255);
    let g = Math.floor(Math.random() * 255);
    let b = Math.floor(Math.random() * 255);
    let rgb = `rgb(${r},${g},${b})`;
    return rgb;
}
// function rand(min,max){
//     return Math.floor(Math.random()*(max-min+1))+min;
// }不用es6的话,但只能r, g, b一个一个去设置。

//运动函数
function startMove(obj, json, fn) {
    clearInterval(obj.timer);//开定时器之前先关掉原有的计时器
    obj.timer = setInterval(function () {
        var bStop = true; //这一次运动就结束了――所有的值都到达了
        for (var attr in json) {
            //1.取当前的值
            var iCur = 0;
            if (attr == 'opacity') {
                iCur = parseInt(parseFloat(getStyle(obj, attr)) * 100);
            } else {
                iCur = parseInt(getStyle(obj, attr));
            }
            //2.算速度
            var iSpeed = (json[attr] - iCur) / 8;
            iSpeed = iSpeed > 0 ? Math.ceil(iSpeed) : Math.floor(iSpeed);
            //3.检测停止
            if (iCur != json[attr]) {
                bStop = false;
            }
            if (attr == 'opacity') {
                obj.style.filter = 'alpha(opacity:' + (iCur + iSpeed) + ')';
                obj.style.opacity = (iCur + iSpeed) / 100;
            } else {
                obj.style[attr] = iCur + iSpeed + 'px';
            }
        }
        if (bStop) {
            clearInterval(obj.timer);
            if (fn) {
                fn();
            }
        }
    }, 30)
}

//获取两个数之间的随机数
function getRandom(min, max) {
    return Math.floor(Math.random() * (max - min)) + min;
}    

不断更新修改中。。。

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

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值