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 相关文章推荐
JavaScript开发时的五个注意事项
Dec 08 Javascript
为jquery.ui.dialog 增加“在当前鼠标位置打开”的功能
Nov 24 Javascript
Safari5中alert的无限循环BUG
Apr 07 Javascript
js控制页面控件隐藏显示的两种方法介绍
Oct 09 Javascript
js去空格技巧分别去字符串前后、左右空格
Oct 21 Javascript
jquery如何根据值设置默认的选中项
Mar 17 Javascript
一个简单的全屏图片上下打开显示网页效果示例
Jul 08 Javascript
在AngularJS应用中实现一些动画效果的代码
Jun 18 Javascript
javascript实现随机显示星星特效
Jan 28 Javascript
JavaScript中无法通过div.style.left获取值的解决方法
Feb 19 Javascript
JS实现按钮颜色切换效果
Sep 05 Javascript
vue实现路由切换改变title功能
May 28 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
Base64在线编码解码实现代码 演示与下载
2011/01/08 PHP
PHP ? EasyUI DataGrid 资料存的方式介绍
2012/11/07 PHP
PHP获取一段文本显示点阵宽度和高度的方法
2015/03/12 PHP
PHP中子类重载父类的方法【parent::方法名】
2016/05/06 PHP
PHP实现函数内修改外部变量值的方法示例
2018/12/28 PHP
JQuery Tips(3) 关于$()包装集内元素的改变
2009/12/14 Javascript
jQuery EasyUI中对表格进行编辑的实现代码
2010/06/10 Javascript
validator验证控件使用代码
2010/11/23 Javascript
输入自动提示搜索提示功能的使用说明:sugggestion.txt
2013/09/02 Javascript
jquery向上向下取整适合分页查询
2014/09/06 Javascript
jQuery右下角悬浮广告实例
2016/10/17 Javascript
es6学习笔记之Async函数基本教程
2017/05/11 Javascript
vue使用keep-alive实现数据缓存不刷新
2017/10/21 Javascript
vue轮播图插件vue-concise-slider的使用
2018/03/13 Javascript
浅谈在Vue.js中如何实现时间转换指令
2019/01/06 Javascript
解决layui富文本编辑器图片上传无法回显的问题
2019/09/18 Javascript
javascript设计模式 ? 桥接模式原理与应用实例分析
2020/04/13 Javascript
js实现前端界面导航栏下拉列表
2020/08/27 Javascript
Python多线程学习资料
2012/12/19 Python
python利用hook技术破解https的实例代码
2013/03/25 Python
使用rpclib进行Python网络编程时的注释问题
2015/05/06 Python
Python编程中time模块的一些关键用法解析
2016/01/19 Python
python调用Delphi写的Dll代码示例
2017/12/05 Python
Django 静态文件配置过程详解
2019/07/23 Python
python数据类型可变不可变知识点总结
2020/03/06 Python
使用CSS3制作倾斜导航条和毛玻璃效果
2017/09/12 HTML / CSS
Bootstrap File Input文件上传组件
2020/12/01 HTML / CSS
全球性的众包图形设计市场:DesignCrowd
2021/02/02 全球购物
北京一家公司的.net开发工程师笔试题
2012/04/17 面试题
正隆泰信息技术有限公司上机题
2012/06/14 面试题
实习鉴定范文
2013/12/19 职场文书
2014年小学数学教师工作总结
2014/12/03 职场文书
行政前台岗位职责
2015/04/16 职场文书
给校长的建议书作文300字
2015/09/14 职场文书
导游词之四川熊猫基地
2020/01/13 职场文书
Oracle数据库中通用的函数实例详解
2022/03/25 Oracle