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. 【转帖】处理器史话 | 服务器CPU市场的战役, AMD、Intel和ARM的厮杀

    处理器史话 | 服务器CPU市场的战役, AMD.Intel和ARM的厮杀 https://www.eefocus.com/mcu-dsp/377300   说完了个性鲜明的消费类电子,接下来聊一聊通 ...

  2. 【LEETCODE】55、数组分类,适中级别,题目:79、611、950

    第950题,这题我是真的没想到居然会说使用队列去做,大神的答案,拿过来瞻仰一下 package y2019.Algorithm.array; import java.util.HashMap; imp ...

  3. vue 仿写微信公众号自定义菜单

    先看效果图 代码参考 <template> <div> <!-- 公众号设置 --> <el-col :span="24" style=& ...

  4. (一)Django项目的目录结构

    1.将app放在apps文件夹中,将改文件夹设置为 source root,便于引用.两个app不可以互相引用,可以利用第三个app实现一些操作. 2.将一些多媒体文件放在media中的相应app名称 ...

  5. 全栈项目|小书架|服务器开发-Koa2 连接MySQL数据库(Navicat+XAMPP)

    为什么使用数据库 为什么需要数据库?-知乎 相比与文件系统,数据库具有以下优势: 高效率:查找效率高 高可用:可数据库共享 安全性强:数据不能随意修改 选择哪个数据库 数据库可以分为关系型数据库和非关 ...

  6. Java身份证处理工具

    身份证处理工具 /** * <html> * <body> * <P> Copyright 1994 JsonInternational</p> * & ...

  7. Sql Server 使用游标辅助循环

    项目临时表#TMPxmdt 存有ID,起始年度,完成年度(int型)两个字段: 实现功能:将#TMPxmdt表中每个ID对应的起始年度至完成年度中所有年度以(ID, ND)的形式插入另一个临时表#TM ...

  8. 设置redis开机自动启动

    注意:win7执行命令前面可不需要加路径,win10必须要加路径 命令: redis-server --service-install redis.windows.conf 执行完成之后,打开服务管理 ...

  9. LINQ按多列分组(Group By)并计算总和(Sum) (转载)

    来源:https://codedefault.com/2018/group-by-multiple-columns-and-sum-in-csharp .NET[C#]LINQ按多列分组(Group ...

  10. 安装node.js->npm->vue

    我们研究vue时,首先操作的就是vue的引用,大部分人为了方便直接在页面上引用vue.js,但是一些大型网站还是比较喜欢用vue的npm命令来安装vue并使用,之前研究vue时,研究过使用npm安装的 ...