JavaScript判斷當前裝置和瀏覽器型別

admin發表於2018-07-23

在實際應用中,可能需要判斷當前裝置和瀏覽器型別,然後進行後續的操作。

程式碼例項如下:

[HTML] 純文字檢視 複製程式碼執行程式碼
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>螞蟻部落</title>
<script>
window.onload = function() {
  //最常規的檢查方法
  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終端
 
  var browser = {
    versions: function() {
      var u = window.navigator.userAgent,
        app = window.navigator.appVersion;
      document.getElementById('antzone').innerHTML = u;
      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.*/), //是否為移動終端
        ios: !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/), //ios終端
        android: u.indexOf('Android') > -1 || u.indexOf('Adr') > -1, //android終端
        iPhone: u.indexOf('iPhone') > -1, //是否為iPhone或者QQHD瀏覽器
        iPad: u.indexOf('iPad') > -1, //是否iPad
        webApp: u.indexOf('Safari') == -1, //是否web應該程式,沒有頭部與底部
        weixin: u.indexOf('MicroMessenger') > -1, //是否微信 (2015-01-22新增)
        qq: u.match(/\sQQ/i) == " qq" //是否QQ
      }
    }(),
    language: (navigator.browserLanguage || navigator.language).toLowerCase()
  }
 
  //判斷是否IE核心
  if (browser.versions.trident) {
    alert("is IE");
  }
  //判斷是否webKit核心
  if (browser.versions.webKit) {
    alert("is webKit");
  }
  //判斷是否移動端
  if (browser.versions.mobile || browser.versions.android || browser.versions.ios) {
    alert("移動端")
  }
 
  var currentLang = navigator.language; //判斷除IE外其他瀏覽器使用語言
  if (!currentLang) { //判斷IE瀏覽器使用語言
    currentLang = navigator.browserLanguage;
  }
  alert(currentLang);
}
</script>
</head>
<body>
<p>當前裝置為:<span id="antzone"></span></p>
</body>
</html>

上述程式碼比較好的實現了判斷功能,需要的可以直接套用。

相關文章