在有空的時候整理一下常用的程式碼，幫助日常開發，提高開發效率。程式碼片段如下所示：

1、判斷是否是移動端

var isApp = function() {
    if (/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)) {
        return true;
    } else {
        return false;
    }
}

2、滑鼠移入移出效果

window.addEventListener('load', function() {
    var box = document.querySelector('.box');
    box.addEventListener(
 
'mouseover', function() {
        box.classList.add('cur');
    });
    box.addEventListener('mouseleave', function() {
        box.classList.remove('cur');
    });
});

3、input獲得失去焦點

window.addEventListener('load', function() {
    var inp = document.querySelector('input');
    if(inp.value === '手機號'){
        inp.style.color 
 
= '#888';
    }else{
        inp.style.color = '#333';
    }

    inp.focus = function(){
        if(this.value === '手機號'){
            this.value = '';
            this.type = 'password';
            this.style.color='#333';
        }else{
            this.style.color = '#333';
        }
    }
    inp.blur 
 
= function(){
        if(this.value == ''){
            this.value = '手機號';
            this.style.color = '#888';
            this.type = 'text';
        }
    }
});

4、驗證碼倒計時

 var time = 60;
 timer = null;
 var sendBtn = document.getElementById('send_btn');
 sendBtn.addEventListener('click', function() {
     timer = setInterval(function() {
         time--;
         if (time <= 0) {
             sendBtn.innerHTML = '傳送驗證碼';
             clearInterval(timer);
             sendBtn.setAttribute('disabled', false);
             time = 60;
         } else {
             sendBtn.innerHTML = time + '秒後重試';
             sendBtn.setAttribute('disabled', true);
         }
     }, 1000)
 });

5、計算當前日期

function caculateDate() {
    var d = new Date();
    var weeks = ['日', '一', '二', '三', '四', '五', '六'];
    var yy = d.getFullYear();
    var mm = d.getMonth() + 1;
    var dd = d.getDate();
    var week = weeks[d.getDay()];
    return yy + '年' + mm + '月' + dd + '日 星期' + week;
}

6、清除浮動

.clearfix: after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}
.clearfix {
    *zoom: 1;
}

7、移動端遮罩層隱藏及顯示效果

.cover{
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 999;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.6);
    -webkit-transform: translate3d(0,200%,0);
    -moz-transform: translate3d(0,200%,0);
    -ms-transform: translate3d(0,200%,0);
    -o-transform: translate3d(0,200%,0);
    transform: translate3d(0,200%,0);
    -webkit-transition: all .25s ease;
    -moz-transition: all .25s ease;
    -ms-transition: all .25s ease;
    -o-transition: all .25s ease;
    transition: all .25s ease;
}
.cover.moved{
    -webkit-transform: translate3d(0,0,0);
    -moz-transform: translate3d(0,0,0);
    -ms-transform: translate3d(0,0,0,0);
    -o-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}

8、