设备区分判断IPAD,H5,PC

 

 

设备区分判断IPAD,H5,PC_第1张图片   设备区分判断IPAD,H5,PC_第2张图片

 

 

 

 

 

HTML:

DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
    <title>设备区分判断title>
    head>
    <body>
    
    
    <div id="app" v-cloak>
      {{flag}}---
      <div id="fit">
      
      <div v-if="flag==2">
        <span class='font36'>这是移动span>
      div>
      
      <div v-else-if="flag==1">
        <span class='font36'>ipadspan>
      div>
      
      <div v-else>
        <span class='font36'>这是pc端span>
      div>
    div>
    <script src="js/vue.js">script>
    
    <script src="js/index.js">script>
body>
html>

 

index.js

// 区分ipad,H5,PC
var userAgentInfo = navigator.userAgent;
var Agents = new Array("Android", "iPhone", "SymbianOS", "Windows Phone", "iPad", "iPod");   
var flag = 0; 
var v=0 
for ( v = 0; v < Agents.length; v++)  
{   
    if (userAgentInfo.indexOf(Agents[v]) > 0) { 
        if(Agents[v]=="iPad"){   //ipad如定义移动端去掉就行了,这里ipad按PC端计算
            flag = 1;
        }else{
            // 移动端
            flag = 2;
        }
        break;
    }
}

// 区分H5,PC
/*
if (/Android|webOS|iPhone|iPod|iPad|BlackBerry|SymbianOS/i.test(navigator.userAgent)) {
    // 移动端
    window.flag = 2
} else {
    // PC端
    window.flag = 1
}
*/
// flag页面中用的VUE写法,需要加VUE声明
var app = new Vue({
    el: "#app",
    data: { },
    methods:{ },
    mounted:function(){ }
})

 

你可能感兴趣的:(设备区分判断IPAD,H5,PC)