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代码格式化和语法着色V2
Oct 14 Javascript
javascript在IE下trim函数无法使用的解决方法
Sep 12 Javascript
DOM基础教程之事件类型
Jan 20 Javascript
基于javascript实现图片滑动效果
May 07 Javascript
原生js代码实现图片放大境效果
Oct 30 Javascript
javascript实现无法关闭的弹框
Nov 27 Javascript
详解为Angular.js内置$http服务添加拦截器的方法
Dec 20 Javascript
Bootstrap table使用方法汇总
Nov 17 Javascript
Vue项目引进ElementUI组件的方法
Nov 11 Javascript
vue+Element-ui实现分页效果实例代码详解
Dec 10 Javascript
JavaScript Tab菜单实现过程解析
May 13 Javascript
梳理一下vue中的生命周期
Dec 30 Vue.js
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
php中禁止单个IP与ip段访问的代码小结
2012/07/04 PHP
学习php过程中的一些注意点的总结
2013/10/25 PHP
如何用PHP来实现一个动态Web服务器
2015/07/29 PHP
PHP魔术方法使用方法汇总
2016/02/14 PHP
Symfony控制层深入详解
2016/03/17 PHP
JQuery对表格进行操作的常用技巧总结
2014/04/23 Javascript
jQuery 中国省市两级联动选择附图
2014/05/14 Javascript
jQuery学习笔记之 Ajax操作篇(一) - 数据加载
2014/06/23 Javascript
node.js 开发指南 ? Node.js 连接 MySQL 并进行数据库操作
2014/07/29 Javascript
JavaScript sup方法入门实例(把字符串显示为上标)
2014/10/20 Javascript
APP中javascript+css3实现下拉刷新效果
2016/01/27 Javascript
详解js的六大数据类型
2016/12/27 Javascript
React Native 通告消息竖向轮播组件的封装
2020/08/25 Javascript
微信小程序和百度的语音识别接口详解
2019/05/06 Javascript
layui+jquery支持IE8的表格分页方法
2019/09/28 jQuery
[46:03]LGD vs VGJ.T 2018国际邀请赛小组赛BO2 第一场 8.16
2018/08/17 DOTA
Python实现把utf-8格式的文件转换成gbk格式的文件
2015/01/22 Python
Python OpenCV处理图像之图像直方图和反向投影
2018/07/10 Python
浅析Python3中的对象垃圾收集机制
2019/06/06 Python
nginx+uwsgi+django环境搭建的方法步骤
2019/11/25 Python
python使用html2text库实现从HTML转markdown的方法详解
2020/02/21 Python
Django choices下拉列表绑定实例
2020/03/13 Python
Python中使用filter过滤列表的一个小技巧分享
2020/05/02 Python
python import 上级目录的导入
2020/11/03 Python
如何使用 Flask 做一个评论系统
2020/11/27 Python
基于HTML5新特性Mutation Observer实现编辑器的撤销和回退操作
2016/01/11 HTML / CSS
C++如何引用一个已经定义过的全局变量
2014/08/25 面试题
汽车技术服务与营销专业在籍生自荐信
2013/09/28 职场文书
同学会主持词
2014/03/18 职场文书
授权委托书样本及填写说明
2014/09/19 职场文书
《半截蜡烛》教学反思
2016/02/19 职场文书
大学迎新生的欢迎词
2019/06/25 职场文书
Oracle 数据仓库ETL技术之多表插入语句的示例详解
2021/04/12 Oracle
Python语言中的数据类型-序列
2022/02/24 Python
springboot 自定义配置 解决Boolean属性不生效
2022/03/18 Java/Android
SpringBoot接入钉钉自定义机器人预警通知
2022/07/15 Java/Android