實(shí)現(xiàn)思路

可以通過 JavaScript 來實(shí)現(xiàn)判斷當(dāng)前的設(shè)備類型：navigator 是 JavaScript 中的一個獨(dú)立的對象，用于提供用戶所使用的瀏覽器以及操作系統(tǒng)等信息，以 navigator 對象屬性的形式來提供。所有瀏覽器都支持該對象。

而 navigator 對象有一個 userAgent 屬性，會返回用戶的設(shè)備操作系統(tǒng)和瀏覽器的信息。 

此時可以通過 userAgent 判斷是 H5 瀏覽器還是 PC 瀏覽器。

而 App 不能獲取 Window 的瀏覽器對象 navigator 的。那么可以在之前判斷是否存在 navigator，不存在即為 App。

js判斷移動端還是pc端

function fIsMobile(){    return /Android|iPhone|iPad|iPod|BlackBerry|webOS|Windows Phone|SymbianOS|IEMobile|Opera Mini/i.test(navigator.userAgent);}

或者：

function iswap() {    var uA = navigator.userAgent.toLowerCase();    var ipad = uA.match(/ipad/i) == "ipad";    var iphone = uA.match(/iphone os/i) == "iphone os";    var midp = uA.match(/midp/i) == "midp";    var uc7 = uA.match(/rv:1.2.3.4/i) == "rv:1.2.3.4";    var uc = uA.match(/ucweb/i) == "ucweb";    var android = uA.match(/android/i) == "android";    var windowsce = uA.match(/windows ce/i) == "windows ce";    var windowsmd = uA.match(/windows mobile/i) == "windows mobile";     if (!(ipad || iphone || midp || uc7 || uc || android || windowsce || windowsmd)) {        // PC 端    }else{        // 移動端    }}

瀏覽器寬度區(qū)分

我們可以利用js代碼，來判斷訪問者設(shè)備屏幕的寬度的大小來確定訪客的設(shè)備是否為移動設(shè)備。

window.screen.availWidth：用來獲取瀏覽器屏幕的寬度。
window.screen.availHeight：用來獲取瀏覽器屏幕的高度。

<script>if(window.screen.availWidth<768){    //移動端}else{    //PC端}</script>

js判斷是否ios或Android

var u = navigator.userAgent;var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android終端var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios終端

區(qū)分Android、iphone、ipad：

ar ua = navigator.userAgent.toLowerCase();if (/android|adr/gi.test(ua)) {    // 安卓  } else if (/\(i[^;]+;( U;)? CPU.+Mac OS X/gi.test(ua)) {    //蘋果  } else if (/iPad/gi.test(ua)) {    //ipad  }

js區(qū)分判斷訪客的瀏覽器

var ua = navigator.userAgent.toLowerCase();if (/msie/i.test(ua) && !/opera/.test(ua)) {    alert("IE");    return;} else if (/firefox/i.test(ua)) {    alert("Firefox");    return;} else if (/chrome/i.test(ua) && /webkit/i.test(ua) && /mozilla/i.test(ua)) {    alert("Chrome");    return;} else if (/opera/i.test(ua)) {    alert("Opera");    return;} else if (/iPad/i) {    alert("ipad");    return;}if (/webkit/i.test(ua) && !(/chrome/i.test(ua) && /webkit/i.test(ua) && /mozilla/i.test(ua))) {    alert("Safari");    return;} else {    alert("unKnow");    }

學(xué)習(xí)更多技能

請點(diǎn)擊下方公眾號