如何在javascript中檢測用戶的瀏覽器並相應地加載類名？

Question

我有以下一段代碼。 有 3 個桌面部分，類名為“desktop-slider”，3 個移動部分，類名為“mobile-slider”。 現在，在每個頁面加載時，桌面用戶應該看到來自“桌面滑塊”的 3 個隨機部分中的 1 個，而移動用戶應該在每個頁面加載時看到來自“移動滑塊”的隨機部分。

現在下面的代碼在桌面上運行良好，但即使是移動版本也為桌面用戶加載。

現在我想添加一個條件來檢測用戶瀏覽器或用戶代理並相應地加載相應的部分。

希望我清楚地解釋了這個問題。 請幫忙。 我卡住了。。

window.onload=function() {
      // For Desktops
      var D = document.getElementsByClassName("desktop-slider");
      var m = D.length;
      var n = parseInt(Math.random()*m);

     // For Mobiles
      var M = document.getElementByClassName("mobile-slider");
      var p = M.length; // Mobile
      var q = parseInt(Math.random()*p); // Mobile

      for (var i=m-1;i>=0;i--) {
          var e = D[i];
          e.style.display='none';
      }
    E[n].style.display='block';
}

Answer 1

您可以像這樣獲得用戶代理https://developer.mozilla.org/en-US/docs/Web/API/NavigatorID/userAgent或者，我建議您使用這樣的庫： https://github。 com/faisalman/ua-parser-js

例子：

if (window.navigator.userAgent.match(/Mobile/)) {
 //do something
} else {
 //do something else
}