/**
* Created by Administrator on 2016/11/21 0021.
*/
/**
* 窗口加载
* @param fn
*/
function addLoadEvent(fn) {
var oldOnLoad = window.onload;
//检查现在的window.onload是否绑定了事件
//console.log(oldOnLoad);
if (typeof oldOnLoad === "function") {//说明之前绑定了事件
window.onload = function () {
oldOnLoad();//之前的要执行
fn();//传入的新的要绑定的将来也要执行
};
} else {
window.onload = fn;
/*window.onload = function () {
fn();
};*/
}
}
/**
* 获取内部文本innerText 的兼容性
* @param element
* @returns {*}
*/
function getInnerText(element) {// 特殊情况 浏览器有innerText 但是当前元素的innerText 里面是空字符串""转换成boolean值是false;
if (typeof element.innerText === "string") {
return element.innerText; // ie 类 旧版
} else {
return element.textContent; //FF 旧版
}
}
/**
*设置内部文本innerText 的兼容性
* @param element
* @param content
*/
function setInnerText(element, content) {
if (typeof element.innerText === "string") {
element.innerText = content;
} else {
element.textContent = content;
}
}
/**
* 封装 获取下一个兄弟元素 的兼容方法
* @param element
* @returns {*}
*/
function getNextElement(element) {
if (element.nextElementSibling) {//能找到
return element.nextElementSibling;
} else {
var next = element.nextSibling;//下一个兄弟节点
while (next && 1 !== next.nodeType) {//有 并且 不是我们要的
next = next.nextSibling;
}
return next;
}
}
/**
* 获取上一个兄弟元素的兼容写法
* @param element
* @returns {*}
*/
function getPreviousElement(element) {
if (element.previousElementSibling) {
return element.previousElementSibling;
} else {
var perv = element.previousSibling;//上一个兄弟节点
while (perv && 1 !== perv.nodeType) {//1有 2不是我们想要的
perv = perv.previousSibling;
}
return perv;
}
}
/**
* 通过类名获取页面元素的兼容性写法
* @param element：获取元素的对象
* @param className：类名
* @returns {返回获得的页面元素}
*/
function getElementsByClassName(element, className) {
if (element.getElementsByClassName) {
return element.getElementsByClassName(className);
} else {
var filterArr = [];//符合类名条件的容器
var elements = element.getElementsByTagName("*");//获得当前元素的所有子元素
for (var i = 0; i < elements.length; i++) {//循环变量每一个元素
//""
var cName = elements[i].className;//获得元素的className
var arr = cName.split(" ");//根据" "分割类名，得到一个数组
for (var j = 0; j < arr.length; j++) {
if (className === arr[j]) {//将拥有这个类名的元素添加到数组中
filterArr.push(elements[i]);
break;
}
}
}
return filterArr;
}
}
/**
*获得页面被卷去部分的封装
*.top就可以获取被卷去的头部的高度
*.left就可以获取被卷去的左侧的宽度
* @returns {{top: (Number|number), left: (Number|number)}}
*/
function scroll() {
return {
top: window.pageYOffset
|| document.documentElement.scrollTop
|| document.body.scrollTop
|| 0,
left: window.pageXOffset
|| document.documentElement.scrollLeft
|| document.body.scrollLeft
|| 0
};
}
/**
* 网页可视区宽 封装
* @returns {Number|number}
*/
function client() {
return {
width: window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth || 0,
height: window.innerHeight || document.documentElement.clientHeight || document.body.clientHeight || 0
};
}
/**
* 缓动动画
* @param obj 要运动的对象
* @param json 对象，里面是obj的一些列属性：属性值（这些属性值相当于是目标值）
* @param fn 在缓动动画结束之后，要执行的函数
*/
function animate(obj, json, fn) {
clearInterval(obj.timer);
obj.timer = setInterval(function () {
var flag = true;
for (var k in json) {
if (k === "opacity") {
var leader = getStyle(obj, k) * 100;
var target = json[k] * 100;
var step = (target - leader) / 10;
step = step > 0 ? Math.ceil(step) : Math.floor(step);
leader = leader + step;
obj.style[k] = leader / 100;
} else if (k === "zIndex") {
obj.style.zIndex = json[k];
} else {
var leader = parseInt(getStyle(obj, k)) || 0;
var target = json[k];
var step = (target - leader) / 10;
step = step > 0 ? Math.ceil(step) : Math.floor(step);
leader = leader + step;
obj.style[k] = leader + "px";
}
if (leader != target) {
flag = false;
}
}
if (flag) {
clearInterval(obj.timer);
if (fn) {
fn();
}
}
}, 15);
}
/**
*在页面上获得属性的方法的封装
* @param obj 要在页面上获得属性的对象
* @param attr 要在页面上获得的属性
* @returns {*}
*/
function getStyle(obj, attr) {
if (window.getComputedStyle) {
return window.getComputedStyle(obj, null)[attr];
} else {
return obj.currentStyle[attr];
}
}
/**
*匀速动画的封装
* @param obj 要运动的对象
* @param target 运动的目标值
* @param stp 一步要运动是距离
*/
function cutton(obj, target, stp) {
clearInterval(obj.timer);
obj.timer = setInterval(function () {
var leader = obj.offsetLeft;
var step = stp;
step = leader < target ? step : -step;
if (Math.abs(target - leader) >= Math.abs(step)) {
leader = leader + step;
obj.style.left = leader + "px";
} else {
obj.style.left = target + "px";
clearInterval(obj.timer);
}
}, 15)
}
/**
* 头部缓动动画
* @param obj
* @param json
* @param fn
*/
function animate1(obj, json, fn) {
clearInterval(obj.timer);
obj.timer = setInterval(function () {
var flag = true;
for (var k in json) {
if (k === "opacity") {
var leader = getStyle(obj, k) * 100;
var target = json[k] * 100;
var step = (target - leader) / 20;
step = step > 0 ? Math.ceil(step) : Math.floor(step);
leader = leader + step;
obj.style[k] = leader / 100;
} else if (k === "zIndex") {
obj.style.zIndex = json[k];
} else {
var leader = parseInt(getStyle(obj, k)) || 0;
var target = json[k];
var step = (target - leader) / 10;
step = step > 0 ? Math.ceil(step) : Math.floor(step);
leader = leader + step;
obj.style[k] = leader + "px";
}
if (leader != target) {
flag = false;
}
}
if (flag) {
clearInterval(obj.timer);
if (fn) {
fn();
}
}
}, 15);
}
/**
* 匀速动画的封装(左右移动)
* @param obj 要运动的对象
* @param target 运动的目标值
* @param stp 一步要运动的距离
*/
function cuttonH(obj, target, stp) {
clearInterval(obj.timer);
obj.timer = setInterval(function () {
var step = stp;
step = obj.offsetTop < target ? step : -step;
if (Math.abs(target - obj.offsetTop) >= Math.abs(step)) {
obj.style.top = obj.offsetTop + step + "px";
} else {
obj.style.top = target + "px";
clearInterval(obj.timer);
}
}, 15)
}
原文：http://www.cnblogs.com/199316xu/p/6426237.html