取得手機版本 – 用 javascript 取得 Android IOS 版本

Introduction

之前有遇到需要用 javascript 動態判斷,使用者是否為 Android 4.4 以下的版本,因為有些程式或 css 不能相容太舊的版本。通常遇到這樣的 case,如果範圍不算大,通常不會特地為了舊手機而改程式,而是動態用程式判斷, 取得手機版本 後,覆寫可以相容的程式上去。

How To Do?

可以先按照以下步驟,試試看印出版本的樣子:

  1. 開啟 Chrome 開發人員工具(右上角功能鈕 => 更多工具 => 開發人員工具)
  2. 點擊切換為手機模式,如圖取得手機版本 - 用 javascript 取得 Android IOS 版本
  3. 可以在左側選擇要模擬的機種
  4. 切換到 console 頁籤
  5. 將下方的程式碼貼在 console 輸入欄位

取得 Android 版本

var versionAry = (navigator.appVersion).match(/Android\s([0-9\.]*)/);
if(versionAry){
  console.log(versionAry[0]); // "Android 5.0"
  console.log(versionAry[1]); // 5.0
} else {
  console.warn("Not a Android device.");
}

取得 iOS 版本

var versionAry = (navigator.appVersion).match(/OS (\d+)_(\d+)_?(\d+)?/);
if(versionAry){
  console.log(versionAry[0]); // "OS 10_3_1"
  console.log(versionAry[1]); // 10
  console.log(versionAry[2]); // 3
  console.log(versionAry[3]); // 1
} else {
  console.warn("Not a iOS device.");
}

Note

如果只是單純想知道手機或平版的版本,即便沒有開發人員工具,也可以連線到 WhoIsHostingThis,一樣可以幫你把手機版本顯示出來哦!

WhoIsHostingThis

留個言吧!