天天看點

仿響應式html:JavaScript判斷裝置處于PC端還是移動端

我們想要的效果是pc檔案和mobile檔案統一入口,适配不同的裝置。 

先看看項目的目錄:  

仿響應式html:JavaScript判斷裝置處于PC端還是移動端

在index.html裡面配置js控制選擇那一個檔案夾下的檔案就可以了。 

我們要利用:Navigator 對象,Navigator 對象包含有關浏覽器的資訊。 

index.html很簡單,直接上碼吧: 

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="initial-scale=1, maximum-scale=1, user-scalable=no" />
        <script type="text/javascript">
            function browserRedirect() {
                var sUserAgent = navigator.userAgent.toLowerCase();
                var bIsIpad = sUserAgent.match(/ipad/i) == "ipad";
                var bIsIphoneOs = sUserAgent.match(/iphone os/i) == "iphone os";
                var bIsMidp = sUserAgent.match(/midp/i) == "midp";
                var bIsUc7 = sUserAgent.match(/rv:1.2.3.4/i) == "rv:1.2.3.4";
                var bIsUc = sUserAgent.match(/ucweb/i) == "ucweb";
                var bIsAndroid = sUserAgent.match(/android/i) == "android";
                var bIsCE = sUserAgent.match(/windows ce/i) == "windows ce";
                var bIsWM = sUserAgent.match(/windows mobile/i) == "windows mobile";
                if (bIsIpad || bIsIphoneOs || bIsMidp || bIsUc7 || bIsUc || bIsAndroid || bIsCE || bIsWM) {
                    //跳轉移動端頁面
                    window.location.href="http://f.jcngame.com/fanfan20171208/mobile/index.html" target="_blank" rel="external nofollow" ;
                } else {
                    //跳轉pc端頁面
                    window.location.href="http://f.jcngame.com/fanfan20171208//fanmai/index.html" target="_blank" rel="external nofollow" ;
                }
            }
            browserRedirect(); 
        </script>
    </head>
    <body>

    </body>
</html>