什么是在所有设备（ipad / iphone / android）中显示内容的附加div的最佳方式，但不在桌面浏览器中显示

Question

我的代码中有两个div块

1. <div class="for-devices">

    //some additional elements

   </div>

2. <div class="for-desktops">

     //some additional elements

   </div>

我的问题是，为设备显示 .for-devices div以及为桌面显示 .for-desktops 的最佳方法是什么。如果我们从设备访问页面 .for-desktop div应该被删除，如果我们从桌面访问页面 .for-devices 应该被删除。

Answer 1

var UserAgent = navigator.userAgent.toLowerCase();

function DetectDevice()
{
   if (UserAgent.search("ipad") > -1 || UserAgent.search("iphone") > -1 || UserAgent.search("android") > -1){
      // Code for above devices
   }
}

DetectDevice();