js判斷ios系統還是android系統 並修改元件樣式

• 在跨平臺、瀏覽器、移動裝置相容的時候，要根據終端裝置的瀏覽器核心做特定調整，判斷Android還是iOS，通過

  navigator.userAgent.toLowerCase() 可以進行判斷。

• navigator是HTML中的內建物件，包含瀏覽器的資訊；userAgent是navigator的屬性方法，可以返回由客戶機發送伺服器的頭部的值，作用其實就是就是返回當前使用者所使用的是什麼瀏覽器，toLowerCase(）是將轉換為小寫。

 export default {

    methods: {

      check() {
        let styleElement = document.getElementById('scrollContainer');
        let ua = window.navigator.userAgent.toLowerCase();
        if (ua.indexOf("android") !== -1) {
          alert('android');
          styleElement.style.cssText = " height: calc(100vh - 80px);";
        } else {
          alert('ios');
          styleElement.style.cssText = " height: calc(100vh - 160px);";
        }
      },
    },
    created() {
      setTimeout(() => {
        this.check();
      }, 5);
    },
  };
 

• 可以看到在vue初始化created()函式中，使用了延時，由於vue在初始化時，DOM還未生成，$el屬性還不存在（詳情參考vue生命週期函式），不能例項化style樣式，通過setTimeout（）延時函式等vue的生命週期結束再載入即可修改樣式。