如果你正在使用React，有一个很棒的库可以解决这类问题:React - agent。(使用ua-parser-js构建。)

https://github.com/medipass/react-ugent

可用的浏览器有:

Chrome, chromium, edge, firefox，即，lynx, safari, opera

可用的操作系统包括:

安卓，黑莓，铬操作系统，debian, ios, linux, MAC操作系统，ubuntu, unix, Windows

可选设备包括:

游戏机、电脑、手机、平板电脑、智能电视、可穿戴、嵌入式

易于使用:

<Ugent browser="safari" os="ios">
  <div>
    This text only shows on Safari on iOS.
  </div>
</Ugent>

如果你不使用React，你可以使用- ua-parser-js

https://github.com/faisalman/ua-parser-js

为了检测iOS版本，我们必须像这样用Javascript代码解构用户代理:

 var res = navigator.userAgent.match(/; CPU.*OS (\d_\d)/);
    if(res) {
        var strVer = res[res.length-1];
        strVer = strVer.replace("_", ".");
        version = strVer * 1;
    }

我在几年前写过这个，但我相信它仍然有效:

if(navigator.vendor != null && navigator.vendor.match(/Apple Computer, Inc./) && navigator.userAgent.match(/iPhone/i) || (navigator.userAgent.match(/iPod/i))) 

    {

        alert("Ipod or Iphone");

    }

else if (navigator.vendor != null && navigator.vendor.match(/Apple Computer, Inc./) && navigator.userAgent.match(/iPad/i))  

    {

        alert("Ipad");

    }

else if (navigator.vendor != null && navigator.vendor.match(/Apple Computer, Inc./) && navigator.userAgent.indexOf('Safari') != -1)

    {

        alert("Safari");

    }

else if (navigator.vendor == null || navigator.vendor != null)

    {

        alert("Not Apple Based Browser");

    }

iOS检测

在iOS 13 iPad中，用户代理和平台字符串都被改变了，iPad和MacOS之间的区别似乎是可能的，所以下面的所有回答都需要考虑到这一点。

这可能是覆盖iOS 13的最短替代方案:

function iOS() {
  return [
    'iPad Simulator',
    'iPhone Simulator',
    'iPod Simulator',
    'iPad',
    'iPhone',
    'iPod'
  ].includes(navigator.platform)
  // iPad on iOS 13 detection
  || (navigator.userAgent.includes("Mac") && "ontouchend" in document)
}

iOS要么为真，要么为假

更糟糕的选择:用户代理嗅探

用户代理嗅探更加危险，经常出现问题。

在iPad iOS 13上，用户代理与MacOS 13计算机上的用户代理相同，但如果你忽略iPad，这可能仍然可以工作一段时间:

var iOS = !window.MSStream && /iPad|iPhone|iPod/.test(navigator.userAgent); // fails on iPad iOS 13

!窗口。MSStream是为了不错误地检测IE11，请看这里和这里。

注意:都是导航器。userAgent和navigator。平台可以被用户或浏览器扩展伪造。

改变userAgent或平台的浏览器扩展存在，因为网站使用了过于繁重的检测，并且经常禁用一些功能，即使用户的浏览器本来可以使用这些功能。

为了减少与用户的冲突，建议针对每种情况专门检测您的网站需要的确切功能。然后，当用户得到一个具有所需功能的浏览器时，它就已经可以工作了，而无需额外的代码更改。

检测iOS版本

检测iOS版本的最常见方法是从User Agent字符串中解析它。但也有特征检测推断*;

我们知道，历史API是在iOS4中引入的，matchMedia API是在iOS5中引入的，webAudio API是在iOS6中引入的，WebSpeech API是在iOS7中引入的，等等。

注意:以下代码是不可靠的，如果这些HTML5功能中的任何一个在更新的iOS版本中被弃用，就会中断。我警告过你!

function iOSversion() {

  if (iOS) { // <-- Use the one here above
    if (window.indexedDB) { return 'iOS 8 and up'; }
    if (window.SpeechSynthesisUtterance) { return 'iOS 7'; }
    if (window.webkitAudioContext) { return 'iOS 6'; }
    if (window.matchMedia) { return 'iOS 5'; }
    if (window.history && 'pushState' in window.history) { return 'iOS 4'; }
    return 'iOS 3 or earlier';
  }

  return 'Not an iOS device';
}

检测iOS(均<12和13+)

社区维基，因为编辑队列说它是满的，所有其他答案目前是过时或不完整的。

const iOS_1to12 = /iPad|iPhone|iPod/.test(navigator.platform);

const iOS13_iPad = (navigator.platform === 'MacIntel' && navigator.maxTouchPoints > 1));

const iOS1to12quirk = function() {
  var audio = new Audio(); // temporary Audio object
  audio.volume = 0.5; // has no effect on iOS <= 12
  return audio.volume === 1;
};

const isIOS = !window.MSStream && (iOS_1to12 || iOS13_iPad || iOS1to12quirk());

一个简化的、易于扩展的版本。

var iOS = ['iPad', 'iPhone', 'iPod'].indexOf(navigator.platform) >= 0;