不幸的是，目前看来这是不可能的: http://www.mobilexweb.com/blog/ipad-mini-detection-for-html5-user-agent

两天前，我在推特上发布了第一个检测到的问题:“是的 确认iPad Mini用户代理与iPad 2相同。” 我收到了成百上千的回答说用户代理 嗅探是一种不好的做法，我们不应该检测特征 设备，等等。 是的，伙计们，你是对的，但这和 这个问题。我需要补充第二个坏消息:没有 客户端技术也不能进行“特征检测”。

我知道这是一个糟糕的解决方案，但目前区分iPad Mini和iPad 2的唯一方法是检查其构建号，并将每个构建号与相关设备映射。

让我给你一个例子:iPad mini，版本6.0，暴露“10A406”作为构建号，而iPad 2暴露“10A5376e”。

这个值可以很容易地通过用户代理(window.navigator.userAgent)上的正则表达式获得;这个号码的前缀是"Mobile/"。

不幸的是，这是唯一明确的检测iPad Mini的方法;我建议采用视口相关的方法(在支持的情况下，使用vh / vw单位)在不同屏幕尺寸上正确显示内容。

我知道这可能是一个低技术含量的解决方案，但由于我们似乎还没有想出任何其他方法。

我假设你已经检查了大多数其他设备，所以我认为以下场景是可能的。

你可以检查所有可能的最流行的设备，需要特殊的CSS/大小，如果它不匹配，要么假设它是iPad mini或简单地问用户?

// Device checks here
...
else {
  // it would probably be better to make this a nicer popup-thing
  var mini = prompt("Are you using a iPad mini? Press yes for a better user experience");
  // Store the result for future visits somehow.
}

我知道这看起来很愚蠢，但如果我们目前无法确定这款设备是iPad mini还是iPad 2，至少该网站在iPad mini设备做这些事情时是可用的。

你甚至可以这样说:

“为了给你最好的浏览体验，我们会检测你的设备类型，根据你的设备定制网站。不幸的是，由于限制，这并不总是可能的，我们目前无法通过使用这些方法来确定您使用的是iPad 2还是iPad mini。

为了获得最佳的浏览体验，请在下面选择您使用的设备。

此选项将被存储，以供将来在此设备上访问该网站时使用。

[] iPad 2 
[*] iPad mini
[] Ancient blackberry device

"

我并不完全了解在Javascript中客户端可以做什么，不可以做什么。我知道你可以得到一个用户的IP，但是可以得到一个用户的mac地址吗?iPad2和iPad mini的这些范围有什么不同吗?

这是一个疯狂的镜头，但iPad 2和iPad mini的区别之一是前者没有三轴陀螺仪。也许可以使用WebKit设备定向API来查看您可以从中获得什么样的信息。

例如，该页似乎建议您只有在设备具有陀螺仪时才能获得rotationRate值。

对不起，我不能给一个工作POC -我没有访问iPad mini。也许对这些定向api有更多了解的人可以在这里插话。

是的，这是一个检查陀螺仪的好点。 你可以很容易地做到

https://developer.apple.com/documentation/webkitjs/devicemotionevent

或者类似的东西

window.ondevicemotion = function(event) {
    if (navigator.platform.indexOf("iPad") != -1 && window.devicePixelRatio == 1) {
        var version = "";
        if (event.acceleration) version = "iPad2";
        else version="iPad Mini";

        alert(version);
    }
    window.ondevicemotion = null;
}​

没有ipad来测试。

播放一个立体声音频文件，比较右声道和左声道音量大时加速计的响应——iPad2有单声道扬声器，而iPad Mini有内置立体声扬声器。

需要你的帮助来收集数据，请访问这个页面，帮助我收集这个疯狂的想法的数据。我没有iPad mini，所以我真的需要你的帮助

那么微基准测试呢，在iPad 2上计算大约需要X微秒，在iPad mini上计算大约需要Y秒。

这可能不够准确，但iPad mini的芯片可能在某些指令上更有效率。

更新:看起来这些值在创建选项卡时报告了视口的宽度和高度，它们在旋转时不会改变，所以这个方法不能用于设备检测!

你可以使用任意一个屏幕。availWidth或screen。availHeight，因为他们似乎是不同的iPad Mini和iPad 2。

iPad迷你

screen.availWidth = 768
screen.availHeight = 1004

iPad 2

screen.availWidth = 748
screen.availHeight = 1024

来源:http://konstruktors.com/blog/web-design/4396-detect-ipad-mini-javascript/

不要补偿iPad mini和iPad 2之间的差异，除非你也补偿了胖手指和瘦手指之间的差异。

Apple appears to be deliberately trying not to let you tell the difference. Apple appears not to want us to write different code for the different size versions of iPads. Not being part of Apple myself, I don't know this for sure, I'm just saying that this is what it appears like. Maybe, if the developer community comes up with a fancy detector for iPad minis, Apple may deliberately break that detector in future versions of iOS. Apple wants you to set your minimum target size to 44 iOS points, and iOS will display that in two sizes, the larger iPad size and the smaller iPhone/iPad mini size. 44 points is plenty generous, and your users will certainly know if they are on the smaller iPad, so can compensate on their own.

I suggest stepping back to your stated reason for asking for the detector: adjusting target size for end user comfort. By deciding to design for one size on the large iPad and another size on the small iPad you are deciding that all people have the same size fingers. If your design is tight enough that the difference in size from an iPad 2 and an iPad mini makes a difference, than the size of fingers between me and my wife will make a bigger difference. So compensate for user finger size, not iPad model.

I have a suggestion on how to measure finger size. I'm a native iOS developer, so I don't know if this can be accomplished in HTML5, but here's how I would measure finger size in a native app. I'd have the user pinch two objects together, then measure how close they get together. Smaller fingers will get the objects closer together, and you can use this measurement to derive a scaling factor. This automatically adjusts for iPad size. The same person will have a larger measurement of on screen points on an iPad mini than on an iPad 2. For a game you can call this a calibration step, or not even call it out. Have it as a starting step. For example in a shooting game have the player put the ammo in the gun with a pinching motion.

编辑1:我最初的回答是“不要这样做”。为了积极:

The real question, I think, has nothing to do with the iPad X vs. iPad mini. I think it is about optimizing UI element dimensions and placement to the user's ergonomics. You need to determine the size of the user's finger/s in order to drive your UI element sizing and, perhaps, positioning. This, again, is and should probably be arrived at without needing to actually know what device you are running on. Let's exaggerate: Your app is running on a 40 inch diagonal screen. Don't know the make and model or the DPI. How do you size the controls?

你需要在网站/游戏中显示一个控制元素的按钮。我将由您决定在哪里或如何做这件事是有意义的。

虽然用户会看到这是一个单独的按钮，但实际上它是由一个小的紧密排列的按钮组成的矩阵，这些按钮在视觉上被覆盖，看起来像一个单独的按钮图像。想象一个100 × 100像素的按钮由400个按钮组成，每个按钮5 × 5像素。你需要实验，看看这里什么是有意义的，以及你的抽样需要多小。

按钮数组可能的CSS:

.sense_row {
  width:100px;
  height:5px;
  margin:0;
  padding:0;
}

.sense_button {
  float:left;
  width:3px;
  height:3px;
  padding:0px;
  margin:0px;
  background-color:#FF0;
  border:1px solid #000;
} 

和生成的数组:

当用户触摸按钮数组时，您将有效地获得用户手指接触区域的图像。然后，您可以使用您想要的任何标准(可能是经验派生的)，以达到一组可以用于根据需求缩放和定位各种UI元素的数字。

这种方法的美妙之处在于，您不再关心您可能要处理的设备名称或型号。你所关心的只是用户手指相对于设备的大小。

我可以想象，这个sense_array按钮可以作为应用程序的入口过程的一部分隐藏起来。例如，如果这是一款游戏，可能会有一个“Play”按钮或各种带有用户名称的按钮，或者选择他们将玩哪个关卡的方法等等。你懂的。sense_array按钮可以位于用户为了进入游戏而触碰的任何地方。

编辑2:只是注意到你可能不需要那么多感知按钮。一组同心圆或按钮排列成一个巨大的星号*可能就可以了。你必须尝试。

下面是我的老答案，我给你硬币的两面。

旧的回答:

正确的答案是:不要这样做。这是个坏主意。

如果你的按钮太小，以至于在mini上无法使用，你就需要让你的按钮变大。

如果说我在开发原生iOS应用的过程中学到了什么，那就是，试图超越苹果只会带来不必要的痛苦和恶化。如果他们选择不让你识别设备，那是因为，在他们的沙盒里，你不应该识别。

我想知道，你在调整纵向和横向的大小/位置吗?

没有测试，但它可以不播放音频文件并检查平衡，而是收听麦克风，提取背景噪声，并计算其“颜色”(频率图)。如果IPad Mini的麦克风型号与IPad 2不同，那么它们的背景颜色应该有明显的不同，一些音频指纹识别技术可能会帮助你判断使用的是哪台设备。

我不认为这种方法可行，在这种特殊情况下不值得这么麻烦，但我认为指纹识别背景噪音可以用于某些应用程序，例如，当你在建筑物内时，它可以告诉你你在哪里。

你总是可以问用户?!

如果用户不能看到按钮或内容，那么就给他们一种自己管理缩放的方法。您总是可以在站点中构建一些缩放按钮，以使内容(文本/按钮)变大/变小。这将(几乎)保证适用于任何iPad当前的分辨率，也可能适用于苹果公司决定的任何未来分辨率。

iPad 2和iPad Mini的电池大小不同。

If iOS 6 supports it, you can get the current battery level from 0.0..1.0 using window.navigator.webkitBattery.level. At some level either in hardware or software, that is likely calculated as CurrentLevel / TotalLevel, where both are ints. If so, that will result in a float which is a multiple of 1 / TotalLevel. If you take lots of battery level readings from both devices, and calculate battery.level * n you might be able to find a value of n where all the results start to be close to integers, which will give you iPad2TotalLevel and iPadMiniTotalLevel.

如果这两个数字不同，并且相互素数，那么在生产中您可以计算电池。* iPad2TotalLevel和电池。level * iPadMiniTotalLevel。更接近整数的值将指示正在使用的设备。

对不起，这个答案中有太多的如果!希望会有更好的事情发生。

不是回答问题，而是问题背后的问题:

您的目标是在更小的屏幕上改善用户体验。UI控件的外观是其中一部分。UX的另一部分是应用程序的响应方式。

如果你将响应点击的区域设置得足够大，以便在iPad Mini上对用户友好，同时保持UI控件的视觉表现足够小，以便在iPad上获得视觉上的愉悦，会怎样?

如果您已经收集了足够多不在可视区域的点击，您可以决定以可视的方式缩放UI控件。

作为奖励，这也适用于iPad上的大手。

这并不是对你提出的问题的回答，但我希望这比说“不要这样做”更有用:

与其检测iPad Mini，为什么不检测用户很难点击控件(或者:总是在控件的子区域中点击)，然后增加/缩小控件的大小来适应他们呢?

对于需要更大控件的用户来说，不管使用什么硬件，他们都可以获得这些控件;那些不需要更大的控制和想要看到更多内容的用户也可以得到。这不像检测硬件那么简单，还有一些细微的事情需要做对，但如果做得仔细的话，效果会很好。

要求所有使用iPad2用户代理的用户使用内置相机提供一张照片，并使用HTML文件API检测分辨率。由于摄像头的改进，iPad Mini照片的分辨率将会更高。

你也可以创建一个不可见的画布元素，并使用canvas API将其转换为PNG/JPG格式。我没有任何方法来测试它，但由于底层的压缩算法和设备的像素密度，产生的比特可能会有所不同。

让用户从离地面几千英尺的高空扔下他们的iPad。然后使用内部加速度计来测量iPad达到终端速度所需的时间。更大的iPad阻力系数更大，达到终端速度的时间应该比iPad Mini更短。

下面是一些示例代码，可以帮助您入门。

function isIPadMini( var timeToReachTerminalVelocity )
{
    return (timeToReachTerminalVelocity > IPAD_MINI_THRESHOLD);
}

当苹果不可避免地以不同的形式发布下一代iPad时，你几乎肯定需要重新审视这段代码。但我相信你会继续跟进事情，并为每一个新版本的iPad保持这个hack。

这让我想起了电影《均衡》中的一句话:

“你说，什么是最简单的方法来从一个文法教士那里拿走武器?” “你问他要吧。”

我们太习惯于为解决方案而斗争了，但有时候，问问自己可能更好。(我们通常不这么做是有充分理由的，但这总是一种选择。)这里的所有建议都很棒，但一个简单的解决方案可能是让你的程序在启动时询问他们使用的是哪台iPad。

我知道这个回答有点厚颜无耻，但我希望这能提醒我们，我们不必为所有事情而奋斗。(我已经做好了接受反对票的准备。: P)

一些例子:

操作系统安装期间的键盘检测有时无法检测到 特定的键盘，所以安装程序必须询问。 Windows询问是否 您连接的网络是家庭网络或公共网络。 计算机无法识别即将使用它的人，所以它们需要用户名和密码。

祝你好运——我希望你能找到一个很棒的解决方案!如果你没有，不要忘记这一点。

这里的所有解决方案都不是万无一失的(这就是为什么苹果不会发布一款屏幕大小与iPad 2相同但分辨率与iPad Mini相同的iPad)。所以我想到了一个主意:

创建一个宽度为1英寸的div，并将其附加到主体。然后我创建另一个宽度为100%的div，并将其附加到主体:

var div1= $("<div/>").appendTo(document.body).width("1in");
var div2= $("<div/>").appendTo(document.body).width("100%");

jQuery width()函数总是以像素为单位返回值，所以你可以:

var screenSize= div2.width() / div1.width();

screenSize现在以英寸为单位保存应用程序可用的大小(但要注意舍入错误)。你可以用它来放置你喜欢的GUI。此外，不要忘记删除无用的divs。

还要注意，Kaspars提出的算法不仅在用户全屏运行应用程序时不起作用，而且在苹果修补浏览器UI时也会失效。

这不会区分设备，但正如您在编辑中解释的那样，您实际上想知道的是设备屏幕大小。我的想法也不会告诉你确切的屏幕大小，但它会给你一个更有用的信息，实际大小(英寸)，你可以用来绘制你的GUI。

编辑: 使用此代码检查它是否在您的设备上实际工作。我没有用来测试的ipad。

var div1= $("<div/>").appendTo(document.body).width("1in").height("1in").css("position", "absolute");
var div2= $("<div/>").appendTo(document.body).width("100%").height("100%").css("position", "absolute");
var width= div2.width() / div1.width()
var height= div2.height() / div1.height()
alert(Math.sqrt(width*width + height*height));

它应该弹出一个窗口与你的屏幕大小英寸。它似乎在我的笔记本电脑上工作，返回15.49，而我的笔记本电脑屏幕销售为15.4英寸。有人能在ipad上测试一下并发表评论吗?别忘了全屏播放。

EDIT2:结果是我测试它的页面有一些冲突的CSS。我修复了测试代码，使其正常工作。你需要的位置:绝对的divs，所以你可以使用高度%。

EDIT3:我做了一些研究，似乎没有办法在任何设备上获得实际的屏幕大小。这不是操作系统能知道的。当你在CSS中使用一个真实的单元时，它实际上只是一个基于屏幕某些属性的估计。不用说，这一点都不准确。

基于Douglas关于iPad 2上的新webkitAudioContext().destination. numberofchannels的问题，我决定运行一些测试。

检查numberOfChannels在iPad mini上返回2，但在iPad 2、iOS 5和iOS 6上没有返回2。

然后我试着检查webkitAudioContext是否可用

var hasWebkitAudio = typeof(webkitAudioContext) === "object";
alert(hasWebkitAudio);​

同样，iPad Mini和iPad 2在iOS 6下返回true，而iPad 2在iOS 5下返回false。

(这个测试不适用于桌面，用于桌面检查webkitAudioContext是否是一个函数)。

下面是供您尝试的代码:http://jsfiddle.net/sqFbc/

如果你创建了一堆1“x1”宽的div，并将它们一个接一个地附加到父div，直到边界框从1英寸跳到2英寸?mini上的一英寸和iPad上的一英寸是一样大的，对吧?

在iOS7中，用户可以调整一个系统范围的设置:当内容太小而无法阅读时，可以更改文本大小设置。

文本大小可以用来形成合理尺寸的UI，例如按钮(在iPad Mini Retina上测试，以响应文本大小设置的变化):

padding: 0.5em 1em 0.5em 1em;
font: -apple-system-body;    

(示例按钮CSS，感谢jsfiddle和cssbuttongenerator)

我通过创建一个iPad mini可以渲染的更大的画布来检测iPad mini，填充一个像素，然后读取颜色。iPad mini显示的颜色是“000000”。其他的都是渲染为填充色。

部分代码:

function rgbToHex(r, g, b) {
    if (r > 255 || g > 255 || b > 255)
        throw "Invalid color component";
    return ((r << 16) | (g << 8) | b).toString(16);
}
var test_colour = '8ed6ff';
working_context.fillStyle = '#' + test_colour;
working_context.fillRect(0,0,1,1);
var colour_data = working_context.getImageData(0, 0, 1, 1).data;
var colour_hex = ("000000" + rgbToHex(colour_data[0], colour_data[1], colour_data[2])).slice(-6);

我需要这个画布大小，所以它的特征检测在我的用例。