目前很多网站都是采用了响应式自适应页面的设计了,根据访问设备的不同,显示不同的内容。但是还是会有一些节奏比较慢的网站,还是PC页面和手机PAD页面不同的访问域名。正好我这里有个需要,同一个域名要根据不同的访问设备显示PC页面或者手机页面,这里收集两个比较简洁的方法,都是通过JS代码实现的。

第一个:

<script type="text/javascript">
var userAgent = navigator.userAgent.toLowerCase();
var platform;
if(userAgent == null || userAgent == ''){
platform = 'WEB' ;
}else{
if(userAgent.indexOf("android") != -1 ){
platform = 'ANDROID';
location.href = "http://m.kuegou.com/";
}else if(userAgent.indexOf("ios") != -1 || userAgent.indexOf("iphone") != -1 || userAgent.indexOf("ipad") != -1){
platform = 'IOS';
location.href = "http://m.kuegou.com/";
}else if(userAgent.indexOf("windows phone") != -1 ){
platform = 'WP';
location.href = "http://m.kuegou.com/";
}else{
platform = 'WEB' ;
location.href = "http://www.kuegou.com/";
}
}
</script>

  

第二个:

这一个是两段代码,分别放到PC页面网页和手机页面网页,实现不同设备访问不同页面都能实现调整,比如电脑访问了手机页面的地址也会跳转到PC页面上来。

首先是放入PC页面的代码:

<script type="text/javascript">
var url = window.location.pathname;
var wapurl="http://3g.xxx.com"+url if(/AppleWebKit.*Mobile/i.test(navigator.userAgent) || (/MIDP|SymbianOS|NOKIA|SAMSUNG|LG|NEC|TCL|Alcatel|BIRD|DBTEL|Dopod|PHILIPS|HAIER|LENOVO|MOT-|Nokia|SonyEricsson|SIE-|Amoi|ZTE/.test(navigator.userAgent))){
if(window.location.href.indexOf("?mobile")<0){
try{
if(/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)){
window.location.href=wapurl;
}else{
window.location.href=wapurl;
}
}catch(e){}
}
}
</script>

  

下边是放入手机页面的代码:

<script type="text/javascript">

var url = window.location.pathname;
var pcurl="http://www.xxx.com"+url if(/AppleWebKit.*Mobile/i.test(navigator.userAgent)==false || (/MIDP|SymbianOS|NOKIA|SAMSUNG|LG|NEC|TCL|Alcatel|BIRD|DBTEL|Dopod|PHILIPS|HAIER|LENOVO|MOT-|Nokia|SonyEricsson|SIE-|Amoi|ZTE/.test(navigator.userAgent))==false){
if(window.location.href.indexOf("?mobile")<0){
try{
if(/Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent)==false){
window.location.href=pcurl;
} }catch(e){}
}
}
</script>

  

根据不同访问设备跳转到PC页面或手机页面的更多相关文章

  1. 用pc浏览器打开手机页面

    原理是仿造http包头,下面已chrome为例. 方法:运行->输入如下手机操作系统对应的代码即可. 安卓: chrome.exe --user-agent="Mozilla/5.0 ...

  2. PC端和手机访问调用不同的页面,JS和PHP不同方法

    js方法: var urlqr = location.href;    urlqr = urlqr.replace(/iphoneF_/, "pc")这里写正则替换页面地址 if( ...

  3. Java判断访问设备为手机、微信、PC工具类

    package com.lwj.util; import javax.servlet.http.HttpServletRequest; /** * 判断访问设备为PC或者手机--工具类 * * @de ...

  4. JS判断访问设备、客户端操作系统类型

    先给出一个实例:判断windows.linux.android 复制以下代码另存为html文件即可. <html> <head> <title>判断操作系统< ...

  5. [转]JS判断访问设备、客户端操作系统类型

    本文转自:http://www.cnblogs.com/duanguyuan/p/3534470.html 先给出一个实例:判断windows.linux.android 复制以下代码另存为html文 ...

  6. JS判断访问设备(userAgent)加载不同页面 JS判断客户端操作系统类型(platform)

    //平台.设备和操作系统 var system ={ win : false, mac : false, xll : false }; //检测平台 var p = navigator.platfor ...

  7. Spring Mobile是如何判断访问设备的类型的

    Spring最近换域名了,去转转,发现了一个有意思的项目:spring mobile. http://projects.spring.io/spring-mobile/ 这个项目有很多实用的功能,如识 ...

  8. 获取ip,获取客户端浏览器,获取客户端访问操作系统,获取客户端访问设备

    /** * 获取ip */ public static function getIp() { if (getenv('HTTP_CLIENT_IP')) { $ip = getenv('HTTP_CL ...

  9. JavaScript获取访问设备信息

    <html xmlns=http://www.w3.org/1999/xhtml> <head> <title>JavaScript获取访问设备信息</tit ...

随机推荐

  1. centos7忘记密码解决办法

    centos7重置密码: centos7一改以往风格,很多方面都做了改进,尤其是修改root密码,一般centos6以前直接进入grub然后从单用户模式进去就可以修改,可centos7不同,笔者今天修 ...

  2. Vue-admin工作整理(十八):Mock的使用方法

    # Mock简明文档           ## Mock.mock()           - Mock.mock( requestUrl?, requestType?, template|funct ...

  3. 【GO】【LiteIDE】

    https://blog.csdn.net/qq_32034593/article/details/82986311 下载地址:https://www.golangtc.com/download/li ...

  4. 从Scratch到Python之角色与造型

    从Scratch到Python之角色与造型 继续讲解通过python turtle从积木编程过渡到代码编程的技巧.角色是scratch中很重要的主角,每个角色可以更换不同的造型或者音效,堆叠不同的积木 ...

  5. JAVA-变量

    静态变量只能在类主体中定义,不能在方法中定义

  6. 2018-2019-2 网络对抗技术 20165303 Exp1 PC平台逆向破解(BOF实验)

    1.实践目的 本次实践的对象是一个名为pwn1的linux可执行文件. 三个实践内容如下: 手工修改可执行文件,改变程序执行流程,直接跳转到getShell函数. 利用foo函数的Bof漏洞,构造一个 ...

  7. Hadoop InputFormat 输入文件分片

    1. Mapper 与 Reducer 数量 对于一个默认的MapReduce Job 来说,map任务的数量等于输入文件被划分成的分块数,这个取决于输入文件的大小以及文件块的大小(如果此文件在 HD ...

  8. cowboy源码分析(二)

    接 cowboy源码分析(一) 下面我们重点看看cowboy_protocol.erl代码 -module(cowboy_protocol). %% API. -export([start_link/ ...

  9. 华为的云计算基于openstack #stackalytics#

    华为的云计算基于openstack,具体实力可以参考openstack 社区提供的stackalytics http://stackalytics.com/

  10. 怎么将GitHub上的项目下载到本地,并运行

    第一步:首页的有项目的地址才能下载 第二步:使用git 下载  命令:git clone 项目地址 第三步:npm install  下载依赖 第四步:npm run dev 运行项目