JS判断不同web访问环境,主要针对移动设备,提供相对应的解析方案(判断设备代码直接copy腾讯网的)

// 判断是否为移动端运行环境 

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)){ 

// 判断访问环境是 Android|webOS|iPhone|iPod|BlackBerry 则加载以下样式 

setActiveStyleSheet("style_mobile_a.css"); 

} 

else if(/iPad/i.test(navigator.userAgent)){ 

// 判断访问环境是 iPad 则加载以下样式 

setActiveStyleSheet("style_mobile_iPad.css"); 

} 

else{ 

// 判断访问环境是 其他移动设备 则加载以下样式 

setActiveStyleSheet("style_mobile_other.css"); 

} 

} 

catch(e){} 

} 

} 

else{ 

// 如果以上都不是,则加载以下样式 

setActiveStyleSheet("style_mobile_no.css"); 

} 

// 判断完毕后加载样式 

function setActiveStyleSheet(filename){document.write("<link href="+filename+" rel=stylesheet>");} 

加载页面

<script type="text/javascript">
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="手机页面";
}else if(/iPad/i.test(navigator.userAgent)){
window.location.href="平板页面";
}else{
window.location.href="其他移动端页面"
}
}catch(e){}
}
}
</script>

JS判断移动端访问设备并加载对应CSS样式的更多相关文章

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

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

  2. 用jquery判断当前显示器的分辨率,加载不同CSS

    <link rel="stylesheet" type="text/css" id="css"><script langu ...

  3. abp架构中加载公共css样式表和公共js的文件目录位置

    src\shared\helpers\LocalizedResourcesHelper.ts

  4. 根据显示器的分辨率,加载不同CSS样式表

    <link rel="stylesheet" type="text/css" id="css"><script langu ...

  5. js判断移动端是否安装某款app的多种方法

    本文实例讲解了js判断移动端是否安装某款app的多种方法,分享给大家供大家参考,具体内容如下 第一种方法: 一:判断是那种设备 ? || u.indexOf(; //android终端或者uc浏览器 ...

  6. 移动端实现上拉加载更多(使用dropload.js vs js)

    做下笔记,:移动端实现上拉加载更多,其实是数据的分段加载,在这里为了做测试我写了几个json文件作为分段数据: 方式一:使用dropload.js; 配置好相关参数及回调函数就可使用:代码如下 var ...

  7. JS 判断移动端与PC端

    js判断移动端与pc端   这里介绍下使用device.js插件来判断移动端设备 地址:https://github.com/matthewhudson/device.js 示例: 1 2 3 4 5 ...

  8. js 判断pc端或手机端

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

  9. JS判断移动端还是PC端(改造自腾讯网) 仅用于宣传动画,下载页等

    JS判断移动端还是PC端(改造自腾讯网 http://www.qq.com/) 本脚本仅用于宣传动画,下载页( ipad 也算pc端)等,  ionic 用 ionic.platform 即可( io ...

随机推荐

  1. [转帖]ARM A77+G77最强公版架构:联发科5G SoC计划11月26日发布

    ARM A77+G77最强公版架构:联发科5G SoC计划11月26日发布 https://www.cnbeta.com/articles/tech/909025.htm 主流的手机SoC厂商已经纷纷 ...

  2. 顶级Apache Kafka术语和概念

    1.卡夫卡术语 基本上,Kafka架构  包含很少的关键术语,如主题,制作人,消费者, 经纪人等等.要详细了解Apache Kafka,我们必须首先理解这些关键术语.因此,在本文“Kafka术语”中, ...

  3. Spring MVC 问题归纳

    记录一些在Spring MVC配置中出现的问题 一.配置tomcat包没有加载 错误: idea调试web项目时出现:java.lang.ClassNotFoundException:org.spri ...

  4. LOJ2026 JLOI/SHOI2016 成绩比较 组合、容斥

    传送门 感觉自己越来越愚钝了qwq 先考虑从\(n-1\)个人里安排恰好\(k\)个人被碾压,然后再考虑如何分配分数,两者乘起来得到答案. 对于第一部分,可以考虑容斥:设\(f_i\)表示\(i\)个 ...

  5. Sql Server 根据条件查找多条数据中最大值的详细记录

    --(正常效果) select l.* from loadCurveSampling l left join Meter m on l.meter_id=m.Meter_ID --聚合当天最大值数据记 ...

  6. C# vb .net实现扭曲角特效滤镜图像处理

    在.net中,如何简单快捷地实现Photoshop滤镜组中的扭曲角效果呢?答案是调用SharpImage!专业图像特效滤镜和合成类库.下面开始演示关键代码,您也可以在文末下载全部源码: 设置授权 第一 ...

  7. Logback+ELK+SpringMVC搭建日志收集服务器

    (转) 1.ELK是什么? ELK是由Elasticsearch.Logstash.Kibana这3个软件的缩写. Elasticsearch是一个分布式搜索分析引擎,稳定.可水平扩展.易于管理是它的 ...

  8. kubernetes第六章--如何访问pod

  9. 【JSP】layui+jsp,根据后台数据给复选框默认勾选

    1.项目中经常使用复选框,当重复加载,就需要从数据库给复选框一个默认的值了. 2.接下来使用的是JSP中迭代的方法,给复选框绑定值.思路和方法不一定好,仅供参考. <input type=&qu ...

  10. HBuilderX打包成安卓或苹果app之后的调试问题,避免每次都要打包

    一.使用VScode安装 Live Server插件 二.使用:安装成功后---->>新建一个index.html 写入内容如下图所示 注:href地址是你在电脑上启动该项目的访问地址(此 ...