javascript判断移动端访问设备并解析对应CSS的方法


Posted in Javascript onFebruary 05, 2015

本文实例讲述了javascript判断移动端访问设备并解析对应CSS的方法。分享给大家供大家参考。具体分析如下:

javascript判断不同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>

希望本文所述对大家的javascript程序设计有所帮助。

Javascript 相关文章推荐
js中window.open打开一个新的页面
Aug 10 Javascript
JS实现的网页倒计时数字时钟效果
Mar 02 Javascript
解决bootstrap中modal遇到Esc键无法关闭页面
Mar 09 Javascript
jQuery代码实现发展历程时间轴特效
Jul 30 Javascript
瀑布流的实现方式(原生js+jquery+css3)
Jun 28 Javascript
浅谈js中调用函数时加不加括号的问题
Jul 28 Javascript
JavaScript实现审核流程状态的动态显示进度条
Mar 15 Javascript
详解webpack2+React 实例demo
Sep 11 Javascript
vue+springboot实现项目的CORS跨域请求
Sep 05 Javascript
angular5 子组件监听父组件传入值的变化方法
Sep 30 Javascript
JS数组Reduce方法功能与用法实例详解
Apr 29 Javascript
原生小程序封装跑马灯效果
Oct 21 Javascript
Javascript数组操作函数总结
Feb 05 #Javascript
Javascript毫秒数用法实例
Feb 05 #Javascript
封装了jQuery的Ajax请求全局配置
Feb 05 #Javascript
node.js集成百度UE编辑器
Feb 05 #Javascript
浅谈JavaScript中Date(日期对象),Math对象
Feb 05 #Javascript
JavaScript计时器示例分析
Feb 05 #Javascript
编写自己的jQuery提示框(Tip)插件
Feb 05 #Javascript
You might like
利用 window_onload 实现select默认选择
2006/10/09 PHP
PHP 强制下载文件代码
2010/10/24 PHP
强制PHP命令行脚本单进程运行的方法
2014/04/15 PHP
解决php用mysql方式连接数据库出现Deprecated报错问题
2019/12/25 PHP
Firefox 无法获取cssRules 的解决办法
2006/10/11 Javascript
URI、URL和URN之间的区别与联系
2006/12/20 Javascript
JavaScript 自动完成脚本整理(33个)
2009/10/20 Javascript
对js关键字命名的疑问介绍
2014/04/25 Javascript
浅谈被jQuery抛弃的函数及替代函数
2015/05/03 Javascript
VC调用javascript的几种方法(推荐)
2016/08/09 Javascript
详解AngularJS1.6版本中ui-router路由中/#!/的解决方法
2017/05/22 Javascript
微信小程序实现下拉菜单切换效果
2020/03/30 Javascript
vue-cli 目录结构详细讲解总结
2019/01/15 Javascript
Vue框架下引入ActiveX控件的问题解决
2019/03/25 Javascript
JavaScript中this函数使用实例解析
2020/02/21 Javascript
vue addRoutes路由动态加载操作
2020/08/04 Javascript
浅析JavaScript 函数柯里化
2020/09/08 Javascript
DWR内存兼容及无法调用问题解决方案
2020/10/16 Javascript
python中bisect模块用法实例
2014/09/25 Python
python使用Turtle库绘制动态钟表
2018/11/19 Python
解决python打不开文件(文件不存在)的问题
2019/02/18 Python
解决Python中回文数和质数的问题
2019/11/24 Python
Python zip函数打包元素实例解析
2019/12/11 Python
pytorch程序异常后删除占用的显存操作
2020/01/13 Python
Pytorch生成随机数Tensor的方法汇总
2020/09/09 Python
Django vue前后端分离整合过程解析
2020/11/20 Python
html5 canvas实现圆形时钟代码分享
2013/12/25 HTML / CSS
The North Face北面美国官网:美国著名户外品牌
2018/09/15 全球购物
意大利中国电子产品购物网站:Geekmall.com
2019/09/30 全球购物
TCP/IP的分层模型
2013/10/27 面试题
教你怎样写好自我评价
2013/10/05 职场文书
物流管理专业职业生涯规划书
2014/01/06 职场文书
军训教官感言
2014/03/02 职场文书
年终总结会主持词
2014/03/25 职场文书
考试作弊检讨
2015/01/27 职场文书
Python OpenGL基本配置方式
2022/05/20 Python