移动端html5开发关于用js检测用户设备

移动端html5开发关于用js检测用户设备

检测移动设备

通过用户代理，检测浏览网页设备为android，iphone，ipad等：

用户代理中包含设备的型号，如android，iphone，ipad等

用正则去匹配UA，得到设备型号

var UA = window.navigator.userAgent,
    isAndorid = /android/i.test(UA),
    isIphone = /iphone/i.test(UA),
    //isIphone = /(?:iPhone)/.test(UA),
    isPad = /ipad/i.test(UA),
    isDolphin = typeof dolphin !== 'undefined';
    device = isAndorid ? 'android' : isIphone ? 'iphone' : isPad ? 'ipad':'unknow';

关于正则表达式中括号、问号和冒号：

正则表达式中，添加括号()，表示将成功匹配字符串赋给RegExp.$1等返回，而括号中表达式之前加“?:”则表示不将匹配字符串赋给RegExp.$1，此时输出RegExp.$1为空

关于i：

正则表达式之后加i表示，匹配字符串不区分大小写

javascript中的RegExp.$1

RegExp 是javascript中的一个内置对象。为正则表达式。
RegExp.$1是RegExp的一个属性,指的是与正则表达式匹配的第一个 子匹配(以括号为标志)字符串，以此类推，RegExp.$2，RegExp.$3，..RegExp.$99总共可以有99个匹配，看了例子就知道了

<script>
    var r= /^(\d{4})-(\d{1,2})-(\d{1,2})$/; //正则表达式 匹配出生日期(简单匹配)     
    r.exec('1985-10-15');
    s1=RegExp.$1;
    s2=RegExp.$2;
    s3=RegExp.$3;
    alert(s1+" "+s2+" "+s3)//结果为1985 10 15
</script>

附加匹配主流浏览器设备：

用JavaScript代码来判断浏览器类型及设备访问该网页，支持手机上所有的浏览器。具体代码如下：

<script>
    //    检测设备类型
    var UA = window.navigator.userAgent,
            isQQBrowser = /(?:MQQBrowser | QQ)/.test(UA),
            isWindowsPhone = /(?:Windows Phone)/.test(ua),
            isSymbian = /(?:SymbianOS)/.test(ua) || isWindowsPhone,
            isAndroid = /(?:Android)/.test(ua),
            isFireFox = /(?:Firefox)/.test(ua),
            isChrome = /(?:Chrome|CriOS)/.test(ua),
            isIpad = /(?:iPad|PlayBook)/.test(ua),
            isTablet = /(?:iPad|PlayBook)/.test(ua)||(isFireFox && /(?:Tablet)/.test(ua)),
            isSafari = /(?:Safari)/.test(ua),
            isPhone = /(?:iPhone)/.test(ua) && !isTablet,
            isOpen= /(?:Opera Mini)/.test(ua),
            isUC = /(?:UCWEB|UCBrowser)/.test(ua),
            isPc = !isPhone && !isAndroid && !isSymbian;
</script>