封裝一些經常使用的js工具函數-不定時更新（但願你們積極留言，反饋bug^_^）

/*華麗----------------------------------------------------------------------------------------------------------------------------------分割線*/
//獲取元素樣式
// 獲取的是計算機計算後的樣式
// 單同樣式不能拿來判斷
// 複合樣式的獲取有兼容性問題
// 能夠使用如backgroundColor的屬性
// 不要有空格
// 不要獲取爲設置的樣式：不兼容
// function getStyle(obj,attr) {
// if (obj.currentStyle) { //標準瀏覽器下
// return obj.currentStyle[attr]; //獲取的是計算機計算後的樣式
// }else{
// return getComputedStyle(obj)[attr] //IE6,7,8下
// }
// }
// getStyle()
//三目簡寫之
function getStyle ( obj, attr ) {
return obj.currentStyle?obj.currentStyle[attr] : getComputedStyle( obj )[attr];
}
/*華麗----------------------------------------------------------------------------------------------------------------------------------分割線*/
// 絕對位置函數 --忽略好多如border
//先清bodyd的margin值
function getPos(obj) {
var pos = {left:0, top:0};
while (obj) {
pos.left += obj.offsetLeft;
pos.top += obj.offsetTop;
obj = obj.offsetParent;
}
return pos;
}
/*華麗----------------------------------------------------------------------------------------------------------------------------------分割線*/
function setStyle(obj, json)
{
var attr="";

for(attr in json)
{
obj.style[attr]=json[attr];
}
}
/*華麗----------------------------------------------------------------------------------------------------------------------------------分割線*/
function getByClass(oParent, sClass)
{
var aEle=document.getElementsByTagName('*');
var re=new RegExp('\\b'+sClass+'\\b', 'i');
var i=0;
var aResult=[];

for(i=0;i<aEle.length;i++)
{
if(re.test(aEle[i].className))
{
aResult.push(aEle[i]);
}
}

return aResult;
}
/*華麗----------------------------------------------------------------------------------------------------------------------------------分割線*/
// 勻速運動框架 -能夠準確的定位
function doMove ( obj, attr, dir, target, endFn ) {

dir = parseInt(getStyle( obj, attr )) < target ? dir : -dir; //方向判斷

clearInterval( obj.timer ); //定時器開前先關

obj.timer = setInterval(function () {

var speed = parseInt(getStyle( obj, attr )) + dir; // 步長

if ( speed > target && dir > 0 || speed < target && dir < 0 ) { //使之準確停下
speed = target;
}

obj.style[attr] = speed + 'px';

if ( speed == target ) {
clearInterval( obj.timer );
endFn && endFn(); //有就執行，沒有就不執行
}
}, 30);
}
/*華麗----------------------------------------------------------------------------------------------------------------------------------分割線*/
//抖動函數
function shake ( obj, attr, endFn ) {
if ( obj.onOff ) return;
obj.onOff = true;
var pos = parseInt( getStyle(obj, attr) );
var arr = []; // 20, -20, 18, -18 ..... 0
var num = 0;
var timer = null;
for ( var i=20; i>0; i-=2 ) {
arr.push( i, -i );
}
arr.push(0);
clearInterval( obj.shaketimer );
obj.shaketimer = setInterval(function (){
obj.style[attr] = pos + arr[num] + 'px';
num++;
if ( num === arr.length ) {
clearInterval( obj.shaketimer );
endFn && endFn();
obj.onOff = false;
}
}, 50);
}
/*華麗----------------------------------------------------------------------------------------------------------------------------------分割線*/
//獲取時間
var obody = document.body; //數字時鐘
setInterval( fnTime, 1000 );
fnTime (); //馬上出現
function fnTime () {
var myTime = new Date();
// 如下獲取到的都是number
var iYear = myTime.getFullYear();
var iMonth = myTime.getMonth()+1;
var iDate = myTime.getDate();
var iWeek = myTime.getDay();
var iHours = myTime.getHours();
var iMin = myTime.getMinutes();
var iSec = myTime.getSeconds();
var str = '';

if( iWeek === 0 ) iWeek = '星期日';
if( iWeek === 1 ) iWeek = '星期一';
if( iWeek === 2 ) iWeek = '星期二';
if( iWeek === 3 ) iWeek = '星期三';
if( iWeek === 4 ) iWeek = '星期四';
if( iWeek === 5 ) iWeek = '星期五';
if( iWeek === 6 ) iWeek = '星期六';

str = iYear+ '年' +iMonth+'月'+iDate+'日 '+iWeek+' '+ toTwo(iHours)+' : '+ toTwo(iMin)+' : '+ toTwo(iSec);

obody.innerHTML = str;
}
};
function toTwo(n) {
return n<10?"0"+n:""+n;
}
// function toTwO(n) {
// if (n<10) {
// return "0"+n;
// }else{
// return ""+n;
// }
// }
/*華麗----------------------------------------------------------------------------------------------------------------------------------分割線*/
// 倒計時
// 如今的時間點（在變）
// 將來的時間點（不變）
/*var iNow = new Date(); // var iNew = new Date( 2013, 10, 27, 21,56,0 ); //兩種類型
var iNew = new Date( 'November 27,2013 22:3:0' );
var t = Math.floor((iNew - iNow)/1000); // 毫秒 - 秒
var str = Math.floor(t/86400)+'天'+Math.floor(t%86400/3600)+'時'+Math.floor(t%86400%3600/60)+'分'+t%60+'秒';
alert( str );
*/
var aInp = document.getElementsByTagName('input');
var iNow = null;
var iNew = null;
var t = 0;
var str = '';
var timer = null;

aInp[2].onclick = function () {
iNew = new Date(aInp[0].value);
clearInterval( timer );

timer = setInterval (function (){

iNow = new Date();
t = Math.floor( ( iNew - iNow ) / 1000 );

if ( t >= 0 ) { //倒計時到了中止

str = Math.floor(t/86400)+'天'+Math.floor(t%86400/3600)+'時'+Math.floor(t%86400%3600/60)+'分'+t%60+'秒';

aInp[1].value = str;

} else {

clearInterval( timer );
}

}, 1000);
};
// 距離：<input class="t1" type="text" value="November 27,2016 22:3:0" /><br />
// 還剩：<input class="t1" type="text" />
// <input type="button" value="開始倒計時吧" />
/*華麗----------------------------------------------------------------------------------------------------------------------------------分割線*/
// 獲取元素到頁面的絕對距離
function getPos(obj) {
var pos = {left:0, top:0};
while (obj) {
pos.left += obj.offsetLeft;
pos.top += obj.offsetTop;
obj = obj.offsetParent;
}
return pos;
}
/*華麗----------------------------------------------------------------------------------------------------------------------------------分割線*/
// 獲取元素的classname
function getElementsByClassName(parent,tagName,className) {
var aEls=parent.getElementsByTagName(tagName);
var arr=[];
for (var i = 0; i < aEls.length; i++) {
// if (aEls[i].className=="box") {s
// arr.push(aEls[i])
// }
var aClassName=aEls[i].className.split(" ")
for (var j = 0; j < aClassName.length; j++) {
if (aClassName[j]==className) {
arr.push(aEls[i]);
break;
}
}
}
return arr;
}
/*華麗----------------------------------------------------------------------------------------------------------------------------------分割線*/
// 添加class
function addClass(obj,className) {
//若是原來沒有class的狀況
if (obj.className=="") {
obj.className=className;
} else {
//若是原來有class的狀況
var arrClassName=obj.className.split(" ");
var _index=arrIndexOf(arrClassName,className);
if (_index==-1) {
//若是添加的class在原來的class中不存在
obj.className+=" "+className;
}
//若是要添加的class在原來的class中存在
}
}
//獲取數組元素位置
function arrIndexOf(arr,v) {
for (var i = 0; i < arr.length; i++) {
if (arr[i]==v) {
return i;
}
}
return -1;
}
//刪除class
removeClass(odiv2,"box")
function removeClass(obj,className) {
//若是原來有class
if ( obj.className!="") {
var arrClassName=obj.className.split(" ")
var _index=arrIndexOf(arrClassName,className);
//若是有咱們要移除的class
if (_index!=-1) {
arrClassName.splice(_index,1);
obj.className=arrClassName.join(" ")
}
}
//若是原來沒有class
}
}
/*華麗----------------------------------------------------------------------------------------------------------------------------------分割線*/
//給一個對象的同一個事件綁定多個不一樣的函數
//給一個元素綁定事件函數的第二種形式
// 事件名
function bind(obj, evname, fn) {
if (obj.addEventListener) {
obj.addEventListener(evname, fn, false);
} else {
obj.attachEvent('on' + evname, function() { //IE下
fn.call(obj);
});
}
}
/*華麗----------------------------------------------------------------------------------------------------------------------------------分割線*/
// 拖拽的封裝
function drag(obj) {

obj.onmousedown = function(ev) {
var ev = ev || event;

var disX = ev.clientX - this.offsetLeft;
var disY = ev.clientY - this.offsetTop;

if ( obj.setCapture ) { //此時obj會監聽後續發生的事件
obj.setCapture();
}

document.onmousemove = function(ev) {
var ev = ev || event;

obj.style.left = ev.clientX - disX + 'px';
obj.style.top = ev.clientY - disY + 'px';
}

document.onmouseup = function() {
document.onmousemove = document.onmouseup = null;
//釋放全局捕獲 releaseCapture();
if ( obj.releaseCapture ) {
obj.releaseCapture();
}
}

return false;

}

}
/*華麗----------------------------------------------------------------------------------------------------------------------------------分割線*/
// 限制範圍的拖拽
function drag1(obj) {

obj.onmousedown = function(ev) {
var ev = ev || event;

var disX = ev.clientX - this.offsetLeft; //當鼠標按下obj時距obj邊界的left/top值
var disY = ev.clientY - this.offsetTop;

if ( obj.setCapture ) {
obj.setCapture();
}

document.onmousemove = function(ev) {
var ev = ev || event;

var L = ev.clientX - disX; //移動過程當中任意時刻obj的left/top值
var T = ev.clientY - disY;
//先限制範圍
if ( L < 0 ) { //修改L的值能夠實現磁性吸附
L = 0;
} else if ( L > document.documentElement.clientWidth - obj.offsetWidth ) { //可視區的寬-當前obj的寬
L = document.documentElement.clientWidth - obj.offsetWidth;
}

if ( T < 0 ) {
T = 0;
} else if ( T > document.documentElement.clientHeight - obj.offsetHeight ) {
T = document.documentElement.clientHeight - obj.offsetHeight;
}

obj.style.left = L + 'px';
obj.style.top = T + 'px';

}

document.onmouseup = function() {
document.onmousemove = document.onmouseup = null;
if ( obj.releaseCapture ) {
obj.releaseCapture();
}
}

return false; //爲了阻止默認行爲

}

}
/*華麗----------------------------------------------------------------------------------------------------------------------------------分割線*/
//cookie操做
function setCookie(key, value, t) {
var oDate = new Date();
oDate.setDate( oDate.getDate() + t );
document.cookie = key + '=' + value + ';expires=' + oDate.toGMTString();
}

function getCookie(key) {
var arr1 = document.cookie.split('; ');
for (var i=0; i<arr1.length; i++) {
var arr2 = arr1[i].split('=');
if ( arr2[0] == key ) {
return decodeURI(arr2[1]);
}
}
}

function removeCookie(key) {
setCookie(key, '', -1);
}
/*華麗----------------------------------------------------------------------------------------------------------------------------------分割線*/
// 完美運動框架
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)
}