• JS实现PC端URL跳转到对应移动端URL


    在做移动端网站时,有时因技术问题或其他原因无法制作响应式版面,而移动端页面只能放到子目录下,但是手机端通过搜索引擎进入网站电脑端子页面,无法匹配到移动端页面,使得用户体验很不好,即影响排名也影响转化。这里有一个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重定向来处理

    品牌vi设计公司http://www.maiqicn.com 办公资源网站大全https://www.wode007.com

  • 相关阅读:
    事件节流函数封装层
    rem布局
    对象克隆2
    HTTP的请求头标签 If-Modified-Since
    java.lang.ClassNotFoundException: oracle.jdbc.driver.OracleDriver
    idea 内置tomcat jersey 跨服务器 上传文件报400错误
    idea 内置tomcat jersey 上传文件报403错误
    java 配置aop 写入无效
    java中AOP的环绕通知
    java的Test 如何使用@Autowired注解
  • 原文地址:https://www.cnblogs.com/xiaonian8/p/13700240.html
Copyright © 2020-2023  润新知