在做移动端网站时,有时因技术问题或其他原因无法制作响应式版面,而移动端页面只能放到子目录下,但是手机端通过搜索引擎进入网站电脑端子页面,无法匹配到移动端页面,使得用户体验很不好,即影响排名也影响转化。这里有一个js代码可以实现用户使用手机访问电脑端,自动跳转到对应手机页面。举例:一个pc页面https://www.800xiaos.com/2/2795/,对应移动url为https://m.800xiaos.com/2/2795/,使用手机端访问pc页面https://www.800xiaos.com/2/2795/,则自动跳转至移动页面https://m.800xiaos.com/2/2795/。js代码如下:

<script type="text/javascript">
function GetUrlRelativePath()
  {
    var url = document.location.toString();
    var arrUrl = url.split("//");
    var start = arrUrl[1].indexOf("/");
    var relUrl = arrUrl[1].substring(start);
    if(relUrl.indexOf("?") != -1){
      relUrl = relUrl.split("?")[0];
    }
    return relUrl;
  }
var userAgentInfo = navigator.userAgent;
var Agents = ["Android", "iPhone","SymbianOS", "Windows Phone","iPad", "iPod"];
var flag = true;
for (var v = 0; v < Agents.length; v++) {
if (userAgentInfo.indexOf(Agents[v]) > 0) {
flag = false;
break;
}
}
if (!flag){
location.href="https://m.800xiaos.com"+GetUrlRelativePath();;
}
</script>

注意:这个办法并非最优选择,弊端在于对搜索引擎并不友好,因为加载资源后再跳转,增加了用户访问成本。建议使用301重定向来处理

推荐阅读:网站优化的排名原理

JS实现PC端URL跳转到对应移动端URL的更多相关文章

  1. drupal7设置不含www的url跳转到含www的url

    打开drupal的.htaccess文件 找到 If your site can be accessed both with and without the 'www.' prefix 将下面对应的三 ...

  2. URL跳转漏洞

    URL跳转原理: 由于越来越多的需要和其他第三方应用交互,以及在自身应用内部根据不同的逻辑将用户引向到不同的页面,譬如一个典型的登录接口就经常需要在认证成功之后将用户引导到登录之前的页面,整个过程中如 ...

  3. js判断PC端 移动端 并跳转到对应页面

    一.PC端跳转到移动端 html页面: <script>var webroot="/",catid="{$catid}",murl="m/ ...

  4. js 判断pc端或手机端

    <script> (function () { var navUA = navigator.userAgent; var defIncludeStr = "iPhone|Andr ...

  5. js判断移动终端url跳转

    CODE <script> //判断终端url跳转 function sp_isMobile() { return Boolean(navigator.userAgent.match(/. ...

  6. JS实现手机访问pc网址自动跳转到wap网站

    之前写pc端直接跳转wap端一直是后端java写的,跟js一样都是根据navigator.userAgent来判断设备是电脑还是手机的,我知道这种前端也可已完成的功能,只是后台比较强势,本人本着以和为 ...

  7. 项目部署之nginx实现PC端和移动端自动跳转

    假设PC端域名为 www.abc.com     移动端域名为m.abc.com PC端nginx配置文件server中加入如下代码: if ($http_host !~ "^www.abc ...

  8. 判断pc端或移动端并跳转

    判断pc端或移动端并跳转 代码目录: index.html代码: <!DOCTYPE html> <html lang="en"> <head> ...

  9. js 点击超链接,执行js脚本,而不进行url跳转

    <!DOCTYPE html><html xmlns="http://www.w3.org/1999/xhtml"><head><meta ...

随机推荐

  1. V - Can you answer these queries? HDU - 4027 线段树 暴力

    V - Can you answer these queries? HDU - 4027 这个题目开始没什么思路,因为不知道要怎么去区间更新这个开根号. 然后稍微看了一下题解,因为每一个数开根号最多开 ...

  2. P2774 方格取数问题 网络流

    题目: P2774 方格取数问题 题目背景 none! 题目描述 在一个有 m*n 个方格的棋盘中,每个方格中有一个正整数.现要从方格中取数,使任意 2 个数所在方格没有公共边,且取出的数的总和最大. ...

  3. 播放音乐(mciSendString)

    1.需要引用命名空间using System.Runtime.InteropServices; 这里只是做了个简单的播放功能,想了解更多查看它的官方文档 [DllImport("winmm. ...

  4. A*启发式搜索

    A*启发式搜索 其实是两种搜索方法的合成( A*搜索算法 + 启发式搜索),但要真正理解A*搜索算法,还是得先从启发式搜索算法谈起. 何为启发式搜索 启发式搜索算法有点像广度优先搜索,不同的是,它会优 ...

  5. Linux内核驱动学习(三)字符型设备驱动之初体验

    Linux字符型设备驱动之初体验 文章目录 Linux字符型设备驱动之初体验 前言 框架 字符型设备 程序实现 cdev kobj owner file_operations dev_t 设备注册过程 ...

  6. Centos7 网卡桥接

     一.在centos7主机创建用于虚拟化的网桥 1)增加 /etc/sysconfig/network-scripts/ifcfg-br0 DEVICE=br0BOOTPROTO=staticONBO ...

  7. 如何将项目发布到npm仓库

    有时候,我们希望将项目里的模块提升为公共模块,以便其他项目也能使用.在前端可以将模块发布到npm仓库,这样所有项目都可以通过 npm install youProject 使用模块了. 这个过程很简单 ...

  8. 单口RAM、双口RAM、FIFO

    单口与双口的区别在于,单口只有一组数据线与地址线,因此读写不能同时进行.而双口有两组数据线与地址线,读写可同时进行.FIFO读写可同时进行,可以看作是双口.    双口RAM分伪双口RAM(Xilin ...

  9. Python哈希表和解析式

    目录 1. 封装和解构 1.1 封装 1.2 解构 2. 集合Set 2.1 初始化 2.2 增加 2.3 删除 2.4 遍历 2.5 并集&交集&差集&对称差集 3.字典 3 ...

  10. springData表关系:一对多

    一.编写实体类进行表关联 1.在一张表的关联属性上添加@OneToMany注解(关联属性用来记录多的一方的信息,是个集合,一般用set) 2.在另一个实体类的关联属性上添加@ManyToOne注解和  ...