JS如何判断是不是iphoneX？

Question

目前只想到一种方法，不知道大家是怎么判断的?

function isIphoneX(){
    return /iphone/gi.test(navigator.userAgent) && (screen.height == 812 && screen.width == 375)
}

Answer 1

参考这篇文章，通过GPU查看，GPU相同，就查看分辨率。通过 JavaScript 获取移动设备的型号

Answer 2

var isIphoneX = /iphone[\s\S]*OS X/.test(navigator.userAgent)

Answer 3

function hasNotch() {

if (CSS.supports('padding-left: constant(safe-area-inset-left)')) {
    var div = document.createElement('div');
    div.style.paddingLeft = 'constant(safe-area-inset-left)';
    document.body.appendChild(div);
    var calculatedPadding =  parseInt(window.getComputedStyle(div).paddingLeft);
    document.body.removeChild(div);
    if (calculatedPadding > 0) {
        return true;
    } 
}
return false;

}

可以用新增的 safe-area-inset-bottom 属性判断

Answer 4

虽然我没做过iPhoneX适配，但我觉得可以实在不行就别嫌麻烦，用排除法吧

Answer 5

目前普遍用的还是判断屏幕分辨率的吧

Answer 6

之前在大漠老师的文章里有看过这样判断：

var isIPhone = navigator.appVersion.match(/iphone/gi);
if(isIPhone){
    // hello
}