區分是移動端還是pc端訪問網站的程式碼

antzone發表於2017-03-17

隨著移動裝置的發展,在移動端訪問網站已經逐漸成為比較普遍的事情,例如使用手機訪問網站,現在已經不是什麼稀罕事情,而且具有很大的市場佔有率,所以很多網站都有兩套模板,一套適合pc端使用,一套適合移動端使用,根據不同的訪問來源來判斷使用哪套模板,下面就介紹一下如何利用javascript來實現此功能。

程式碼如下:

[JavaScript] 純文字檢視 複製程式碼
var browser={ 
  versions:function(){ 
    var u = navigator.userAgent, app = navigator.appVersion; 
    return { 
      trident: u.indexOf('Trident') > -1, //IE核心 
      presto: u.indexOf('Presto') > -1, //opera核心 
      webKit: u.indexOf('AppleWebKit') > -1, //蘋果、谷歌核心 
      gecko: u.indexOf('Gecko') > -1 && u.indexOf('KHTML') == -1, //火狐核心 
      mobile: !!u.match(/AppleWebKit.*Mobile.*/)||!!u.match(/AppleWebKit/), //是否為移動終端 
      ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios終端 
      android: u.indexOf('Android') > -1 || u.indexOf('Linux') > -1, //android終端或者uc瀏覽器 
      iPhone: u.indexOf('iPhone') > -1 || u.indexOf('Mac') > -1, //是否為iPhone或者QQHD瀏覽器 
      iPad: u.indexOf('iPad') > -1, //是否iPad 
      webApp: u.indexOf('Safari') == -1 //是否web應該程式,沒有頭部與底部 
    };
  }()
} 
 
console.log(" 是否為移動終端: "+browser.versions.mobile);
console.log(" ios終端: "+browser.versions.ios);
console.log(" android終端: "+browser.versions.android);
console.log(" 是否為iPhone: "+browser.versions.iPhone);
console.log(" 是否iPad: "+browser.versions.iPad);
console.log(navigator.userAgent);

相關文章