zoukankan      html  css  js  c++  java
  • 手机端和PC端分别加载不同的js文件

    分手机端和PC端其实方法很多,我们在响应式设计、响应式网站建设中经常碰到此类需求。下面说说我们在项目中遇到的需求:

    手机端和PC端分别加载不同的js客服代码(注意:是要在PC和手机端分别加载不同的js文件)

    第一种方法(简单型):

    <script type="text/javascript">  
    // 根据屏幕尺寸  
    if (screen && screen.width > 480) {  
    document.write('<script type="text/javascript" charset="utf-8" src="123.js"></script>');  
    }  
      
    // userAgent判断  
    if( /Android|webOS|iPhone|iPod|iPad|BlackBerry/i.test(navigator.userAgent)){  
    document.write('<script type="text/javascript" charset="utf-8" src="123.js"></script>');  
    }  
    </script> 

     第二种方法(已测试通过,项目真实在用):

      
    <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";  
    // document.writeln("您的浏览设备为:");  
    if (bIsIpad || bIsIphoneOs || bIsMidp || bIsUc7 || bIsUc || bIsAndroid || bIsCE || bIsWM) {  
      
    // alert("手机浏览!");  
      
    document.write('<script type="text/javascript" charset="utf-8" src="123.js"></script>');  
    } else {  
      
    // alert("PC浏览!");  
    document.write('<script type="text/javascript" charset="utf-8" src="123.js"></script>');  
    }  
    }  
    browserRedirect();  
    </script>  

    这样子我们直接在PC端和手机端分别输出不同的js。所以,我们在手机端和PC端分别加载不同的js的需求完美解决了。 

  • 相关阅读:
    git常用命令
    thinkjs框架发布上线PM2管理,静态资源访问配置
    登陆服务器提示“You need to run "nvm install N/A" to install it before using it.”
    CentOS 7.x 用shell增加、删除端口
    CentOS 7.X 安全手记
    Centos 7.x nginx隐藏版本号
    centos7磁盘挂载及取消
    CentOS 7.4上网速度慢,修改DNS!
    Centos7.4 安装Docker
    Nodejs 使用log4js日志
  • 原文地址:https://www.cnblogs.com/ghfjj/p/8520652.html
Copyright © 2011-2022 走看看