JavaScript前端實用小函數

參考:火辣辣前端博客

一、判斷是手機仍是pc端

function IsPC() {
	var userAgentInfo = navigator.userAgent;
	var Agents = ["Android", "iPhone",
		"SymbianOS", "Windows Phone",
		"iPad", "iPod"	];
	var flag = true;
	for(var v = 0; v < Agents.length; v++) {
		if(userAgentInfo.indexOf(Agents[v]) > 0) {
			flag = false;
			break;
		}
	}
	return flag;
}複製代碼

二、判斷手機是橫屏仍是豎屏

var isPortrait = true; //竪屏
function onMatchMeidaChange() {
	var mql = window.matchMedia('(orientation: portrait)')
	if(mql.matches) {
		// 豎屏
		isPortrait = true;
	} else {
		//橫屏
		isPortrait = false;
	}
}
onMatchMeidaChange();
window.matchMedia('(orientation: portrait)').addListener(onMatchMeidaChange);複製代碼

三、簡單的防抖動函數

function debounce(func, wait, immediate) {
	// 定時器變量
	var timeout;
	return function() {
		// 每次觸發 scroll handler 時先清除定時器
		clearTimeout(timeout);
		// 指定 xx ms 後觸發真正想進行的操做 handler
		timeout = setTimeout(func, wait);
	};
};  
// 採用了防抖動
var i=0;
window.addEventListener('scroll',debounce(function(){ 
   //功能代碼 
   console.log(i);
},500));複製代碼

四、簡單的節流函數

// 簡單的節流函數
function throttle(func, wait, mustRun) {
    var timeout,
        startTime = new Date(); 
    return function() { 
       var context = this, 
           args = arguments,
            curTime = new Date();
         clearTimeout(timeout);
        // 若是達到了規定的觸發時間間隔,觸發 handler
        if(curTime - startTime >= mustRun){
            func.apply(context,args);
            startTime = curTime;
        // 沒達到觸發間隔,從新設定定時器 
       }else{
            timeout = setTimeout(func, wait);
        }
    };
};
  // 採用了節流函數
var i=0;
window.addEventListener('scroll',throttle(function(){ 
   //功能代碼
    console.log(i);
},500,1000));複製代碼

五、判斷是手機QQ內置瀏覽器仍是外部瀏覽器

function isQQ(){
	var ua = navigator.userAgent.toLowerCase();
	if (ua.match(/QQ/i) == "qq") { 
           return true; 
   	}
}複製代碼

六、判斷是否是微信端

function isWeChat() {
	var ua = navigator.userAgent.toLowerCase();
	if(ua.indexOf('MicroMessenger') > -1) {
		return true;
  	}
}複製代碼

七、判斷ie瀏覽器版本

function IEVersion() {
			var userAgent = navigator.userAgent; //取得瀏覽器的userAgent字符串
  			var isIE = userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1; //判斷是否IE<11瀏覽器
  			if(isIE) {
				var reIE = new RegExp("MSIE (\\d+\\.\\d+);");
				reIE.test(userAgent);
				var fIEVersion = parseFloat(RegExp["$1"]);
				if(fIEVersion >= 9) {
					console.log("瀏覽器版本爲IE9以上版本");
				} else {
					console.log("瀏覽器版本爲IE8如下版本");
				}
			}
		}複製代碼

八、 瀏覽器刷新回到頂部

window.onbeforeunload = function() {
			document.documentElement.scrollTop = 0; //ie下
			document.body.scrollTop = 0; //非ie
}複製代碼
相關文章
相關標籤/搜索