PS:网页自适应的方式有多种。有通过CSS样式表来实现自适应(主流),也有通过显示不同的页面来实现的方式。

下面代码是记录通过判断设备特征来跳转到相关的页面的方法。

实现要求:

当手机,平板访问 a.com 时,自动跳转到 a.com/m 页面(为移动设备开发的页面)。

如果是PC,则正常访问 a.com或 a.com/pc(为电脑端开发的页面)

实现方法:

<script>
var is_mobi = navigator.userAgent.toLowerCase().match(/(ipod|iphone|android|coolpad|mmp|smartphone|midp|wap|xoom|symbian|j2me|blackberry|wince)/i) != null;
if (is_mobi) {
window.location.href = "http://a.com/m";
}
else {
window.location.href = "http://a.com/pc";
}
</script>

js检测移动设备并跳转到相关适应页面。的更多相关文章

  1. JS解析Json 数据并跳转到一个新页面,取消A 标签跳转

    JS解析Json 数据并跳转到一个新页面,代码如下 $.getJSON("http://api.cn.abb.com/common/api/staff/employee/" + o ...

  2. js检测当前设备是移动端还是PC端

    加上下面js即可 硬核判断: <script type="text/javascript"> //平台.设备和操作系统 var system ={ win : fals ...

  3. 使用js实现移动设备访问跳转到指定目录

    最近最项目的时候总会同时做pc站点跟手机站点,当手机访问的时候默认是看到pc站点的,需要在url上加上/mobile才能正常访问,这段代码是我同事分享给我的,还是蛮实用的. CODE function ...

  4. js检测访问设备

    if (navigator.userAgent.match(/(iPod|iPhone|iPad)/)) { }

  5. JS检测当前设备是PC还是移动端

    用到的时候找到的分享下,也是收藏下,本地收藏多了感觉找起来很麻烦 方法1: function IsPC() { var userAgentInfo = navigator.userAgent; var ...

  6. 使用js插件进行设备检测

    一.分析新浪网是怎么做的   如新浪网有两种版本,一种是pc版,存放在www.sina.com.cn这个服务器上:另外一种是手机版,存放在www.sina.cn这个服务器上 原理是当用户输入网址www ...

  7. js判断设备,跳转app应用、android市场或者AppStore

    js移动设备判断方法大全 <!DOCTYPE html> <html> <head> <meta charset="UTF-8" > ...

  8. js/css 检测移动设备方向的变化 判断横竖屏幕

    js/css 检测移动设备方向的变化 判断横竖屏幕 方法一:用触发手机的横屏和竖屏之间的切换的事件 window.addEventListener("orientationchange&qu ...

  9. JS和css实现检测移动设备方向的变化并判断横竖屏幕

    这篇文章主要介绍了JS和css实现检测移动设备方向的变化并判断横竖屏幕,本文分别给出实现代码,需要的朋友可以参考下 方法一:用触发手机的横屏和竖屏之间的切换的事件  [自测可用, chrome , 手 ...

随机推荐

  1. ThreadPoolExecutor解析

    前言:在最新的阿里规范中强制使用ThreadPoolExecutor方式创建线程池,不允许使用Executors,因此有必要对ThreadPoolExecutor进行进一步了解. 1.ThreadPo ...

  2. UVA - 10917 - Walk Through the Forest(最短路+记忆化搜索)

    Problem    UVA - 10917 - Walk Through the Forest Time Limit: 3000 mSec Problem Description Jimmy exp ...

  3. 文本分类实战(四)—— Bi-LSTM模型

    1 大纲概述 文本分类这个系列将会有十篇左右,包括基于word2vec预训练的文本分类,与及基于最新的预训练模型(ELMo,BERT等)的文本分类.总共有以下系列: word2vec预训练词向量 te ...

  4. spring cloud中feign的使用

    我们在进行微服务项目的开发的时候,经常会遇到一个问题,比如A服务是一个针对用户的服务,里面有用户的增删改查的接口和方法,而现在我有一个针对产品的服务B服务中有一个查找用户的需求,这个时候我们可以在B服 ...

  5. iOS开发基础-九宫格坐标(4)

    对iOS开发基础-九宫格坐标(3)的代码进行进一步优化. 新建一个 UIView 的子类,并命名为 WJQAppView ,将 appxib.xib 中的 UIView 对象与新建的视图类进行关联. ...

  6. Java 208 道面试题:第一模块答案

    目前市面上的面试题存在两大问题:第一,题目太旧好久没有更新了,还都停留在 2010 年之前的状态:第二,近几年 JDK 更新和发布都很快,Java 的用法也变了不少,加上 Java 技术栈也加入了很多 ...

  7. 在Asp.Net Core中使用DI的方式使用Hangfire构建后台执行脚本

    最近项目中需要用到后台Job,原有在Windows中我们会使用命令行程序结合计划任务或者直接生成Windows Service,现在.Net Core跨平台了,虽然Linux下也有计划任务,但跟原有方 ...

  8. jeecg字典表-系统字典

    新建字典 录入字典信息 添加类型 录入完类型后效果 新建列表用户 保存 同步数据库 同步完之后,对应的数据库中会创建对应的表. 测试表功能 保存之后,数据库保存对应的字段 生成代码 刷新工程之后,生成 ...

  9. websocket作用及意义

    Browser已经支持http协议,为什么还要开发一种新的WebSocket协议呢?我们知道http协议是一种单向的网络协议,在建立连接后,它只允许Browser/UA(UserAgent)向WebS ...

  10. vue.js实战——升级版购物车

    HTML: <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF ...