需要区分 iPhone3x 和 iPhone4x 。有没有办法从JavaScript中找出版本？
答案 0 :(得分：8)
这将是Javascript中两种方法的组合：
function iPhoneVersion() {
var iHeight = window.screen.height;
var iWidth = window.screen.width;
if (iWidth === 414 && iHeight === 896) {
return "Xmax-Xr";
}
else if (iWidth === 375 && iHeight === 812) {
return "X-Xs";
}
else if (iWidth === 320 && iHeight === 480) {
return "4";
}
else if (iWidth === 375 && iHeight === 667) {
return "6";
}
else if (iWidth === 414 && iHeight === 736) {
return "6+";
}
else if (iWidth === 320 && iHeight === 568) {
return "5";
}
else if (iHeight <= 480) {
return "2-3";
}
return 'none';
}
function isIphone() {
return !!navigator.userAgent.match(/iPhone/i);
}
所以你需要做的就是测试它是否是Iphone，然后获得版本：
if ( isIphone() && iPhoneVersion() === "6"){
//code..
}
答案 1 :(得分：6)
您可以使用navigator.userAgent检查操作系统版本，但这不是问题所在。
您可以使用媒体查询来检查设备的实际屏幕分辨率，这可能是导致问题的原因。
var isRetina = window.matchMedia("(-webkit-min-device-pixel-ratio: 2)").matches;
你也可能没有JavaScript，使用媒体查询为视网膜显示加载不同的样式表：
<link rel="stylesheet" href="retina.css"
media="only screen and (-webkit-min-device-pixel-ratio: 2)" />
答案 2 :(得分：5)
通过使用WEBGL_debug_renderer_info扩展，它是WebGL API的一部分，您可以检索GPU的供应商和渲染器名称。
将此功能与设备的屏幕尺寸相结合，您可以准确定义它的版本。下面的代码示例显示了如何为包括3和4的所有iPhone版本执行此操作。
// iPhone model checks.
function getiPhoneModel() {
// Create a canvas element which can be used to retrieve information about the GPU.
var canvas = document.createElement("canvas");
if (canvas) {
var context = canvas.getContext("webgl") || canvas.getContext("experimental-webgl");
if (context) {
var info = context.getExtension("WEBGL_debug_renderer_info");
if (info) {
var renderer = context.getParameter(info.UNMASKED_RENDERER_WEBGL);
}
}
}
// iPhone X
if ((window.screen.height / window.screen.width == 812 / 375) && (window.devicePixelRatio == 3)) {
return "iPhone X";
// iPhone 6+/6s+/7+ and 8+
} else if ((window.screen.height / window.screen.width == 736 / 414) && (window.devicePixelRatio == 3)) {
switch (renderer) {
default:
return "iPhone 6 Plus, 6s Plus, 7 Plus or 8 Plus";
case "Apple A8 GPU":
return "iPhone 6 Plus";
case "Apple A9 GPU":
return "iPhone 6s Plus";
case "Apple A10 GPU":
return "iPhone 7 Plus";
case "Apple A11 GPU":
return "iPhone 8 Plus";
}
// iPhone 6+/6s+/7+ and 8+ in zoom mode
} else if ((window.screen.height / window.screen.width == 667 / 375) && (window.devicePixelRatio == 3)) {
switch(renderer) {
default:
return "iPhone 6 Plus, 6s Plus, 7 Plus or 8 Plus (display zoom)";
case "Apple A8 GPU":
return "iPhone 6 Plus (display zoom)";
case "Apple A9 GPU":
return "iPhone 6s Plus (display zoom)";
case "Apple A10 GPU":
return "iPhone 7 Plus (display zoom)";
case "Apple A11 GPU":
return "iPhone 8 Plus (display zoom)";
}
// iPhone 6/6s/7 and 8
} else if ((window.screen.height / window.screen.width == 667 / 375) && (window.devicePixelRatio == 2)) {
switch(renderer) {
default:
return "iPhone 6, 6s, 7 or 8";
case "Apple A8 GPU":
return "iPhone 6";
case "Apple A9 GPU":
return "iPhone 6s";
case "Apple A10 GPU":
return "iPhone 7";
case "Apple A11 GPU":
return "iPhone 8";
}
// iPhone 5/5C/5s/SE or 6/6s/7 and 8 in zoom mode
} else if ((window.screen.height / window.screen.width == 1.775) && (window.devicePixelRatio == 2)) {
switch(renderer) {
default:
return "iPhone 5, 5C, 5S, SE or 6, 6s, 7 and 8 (display zoom)";
case "PowerVR SGX 543":
return "iPhone 5 or 5c";
case "Apple A7 GPU":
return "iPhone 5s";
case "Apple A8 GPU":
return "iPhone 6 (display zoom)";
case "Apple A9 GPU":
return "iPhone SE or 6s (display zoom)";
case "Apple A10 GPU":
return "iPhone 7 (display zoom)";
case "Apple A11 GPU":
return "iPhone 8 (display zoom)";
}
// iPhone 4/4s
} else if ((window.screen.height / window.screen.width == 1.5) && (window.devicePixelRatio == 2)) {
switch(renderer) {
default:
return "iPhone 4 or 4s";
case "PowerVR SGX 535":
return "iPhone 4";
case "PowerVR SGX 543":
return "iPhone 4s";
}
// iPhone 1/3G/3GS
} else if ((window.screen.height / window.screen.width == 1.5) && (window.devicePixelRatio == 1)) {
switch(renderer) {
default:
return "iPhone 1, 3G or 3GS";
case "ALP0298C05":
return "iPhone 3GS";
case "S5L8900":
return "iPhone 1, 3G";
}
} else {
return "Not an iPhone";
}
}
答案 3 :(得分：1)
前一段时间我遇到过类似的问题。在客户的网站上工作，有很多视频通过javascript加载，我发现他们需要使用的视频格式有一个奇怪的帧率，在iPhone 3GS上无效 - 。
遵循atornblad的方法，我得到了完全符合我需要的解决方案：
if((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i))) {
if (!(window.devicePixelRatio > 1)){
//non retina iphone / ipod
}
};
首先，它会检查用户是从iPod还是iPhone来找我。然后，它检查Retina支持。由于只有iPhone 4+支持它，我设法为旧设备调用正确的视频文件。
答案 4 :(得分：0)
关于更多CPU速度测量方法的一些事情：它们可能是一种“不合适”的方法，但是在某些情况下，找出目标设备的计算能力可能会有用。
所以这里是我想要添加到这些方法的东西：不是计算固定值并测量时间，而是计算固定时间然后比较达到的值会更加健壮。 如果您的用户在速度较慢的设备上访问您，可能是因为它在模拟器中运行，他将不得不等到您数到n。如果你之后离开了循环，比如200ms，那么你只会重新获得一个非常低的值，而且UX不受影响。
此外，我们总是很高兴知道，操作需要多长时间，它可以减少不确定性。
答案 5 :(得分：-1)
也许你可以通过查询navigator.appVersion.indexOf("...中的操作系统版本来检查它
iphone3G有Apple iOS 4.2.1
iphone4和4S有Apple iOS 5.0.1但iphone3GS也有相同的功能。
作为变体，您可以通过使用大循环来提供cpu速度测试。类似于for (var i=0, k=1; i<5000000; i++) k++;和checkin消耗的时间。
iphone3G（S）最高600 Mhz，而iphone4有1 Ghz。因此，有一个区别，你可以在一些测试（循环）后捕获它并定义每个iphone代的循环速度。
但请注意，所有这些方式都很粗糙，在其他条件下可能不正确。