js 获取手机浏览器类型,修改css文件的class的值

简介:
/*=========================================
    函数功能:获取浏览器类型
=========================================*/
function getBrowser()
{
    var type = "pc"
    var ua = navigator.userAgent.toLowerCase();
    /*
    Navigator 是HTML DOM中的内置对象,它包含有关浏览器的信息。userAgent是Navigator 的属性方法,可返回由客户机发送服务器的 user-agent 头部的值。作用其实就是返回当前用户所使用的是什么浏览器,*/

    if(ua.indexOf('android') > -1)
    {
        type = "android"

        var start_index = ua.indexOf('android');

        var version = ua.substring(start_index, start_index + 12);

        version = version.replace("/", " ");

        // 低于 android 4.4 版本
        if(version < "android 4.4")
        {
            params.lowVersion = true;

            updateClass("common.css", ".modal-dialog", function(cssRule){
                cssRule.style.top = "2%";
                cssRule.style.marginTop = "0px";
            });
            /*
            .modal-dialog
                {
                  top: 45%;
                  left: 50%;
                  width: 300px;
                  height: 500px;
                  position: absolute;
                  margin: -120px 0px 0px -150px;
                }
            */
        }

    }
    else if(ua.indexOf('iphone') > -1 || ua.indexOf('ipad') > -1)
    {
        type = "ios";
    }

    return type;
}

/**
 * 修改文件样式
 * @param fileName  文件名称
 * @param className 样式名称
 * @param method    回调函数, 在回调函数内修改样式
 */
function updateClass(fileName, className, method)
{
    var styleSheet = null, cssRule = null;
    //document.styleSheets:获取页面的所有css样式<link rel="stylesheet" type="text/css" href="../../../css/common.css">
    for(var i = 0, len = document.styleSheets.length; i < len; i++) {
        if(document.styleSheets[i].href != null && document.styleSheets[i].href.indexOf(fileName) >= 0)
        {
            styleSheet = document.styleSheets[i];
            break;
        }
    }

    if(styleSheet == null)
    {
        return;
    }
//styleSheet.cssRules获取common.css文件的所有class样式
    for(var i = 0, len = styleSheet.cssRules.length; i < len; i++)
    {
        if(styleSheet.cssRules[i].selectorText && styleSheet.cssRules[i].selectorText.indexOf(className) >=0 )
        {
            cssRule = styleSheet.cssRules[i];
            /*cssRule为:
            .modal-dialog
                {
                  top: 45%;
                  left: 50%;
                  width: 300px;
                  height: 500px;
                  position: absolute;
                  margin: -120px 0px 0px -150px;
                }
            */
            method(cssRule);
            return;
        }
    }
}
复制代码

 

复制代码
params['ywlx'] = document.body==undefined ? "" : (document.body.getAttribute("data-ywlx") || "");


<!DOCTYPE HTML>
<html ng-app="ptjyChaChe" ng-controller="ptjyChaCheController">
<body data-ywlx="ptjy"> 
复制代码

 


本文转自农夫山泉别墅博客园博客,原文链接:http://www.cnblogs.com/yaowen/p/5566392.html,如需转载请自行联系原作者

相关文章
|
7天前
|
JavaScript 前端开发 容器
AJAX载入外部JS文件到页面并让其执行的方法(附源码)
AJAX载入外部JS文件到页面并让其执行的方法(附源码)
11 0
|
13天前
|
JavaScript
常见函数的4种类型(js的问题)
常见函数的4种类型(js的问题)
10 0
|
15天前
|
JavaScript 前端开发 UED
JS:如何获取浏览器窗口尺寸?
JS:如何获取浏览器窗口尺寸?
23 1
|
29天前
|
JSON JavaScript 前端开发
解决js中Long类型数据在请求与响应过程精度丢失问题(springboot项目中)
解决js中Long类型数据在请求与响应过程精度丢失问题(springboot项目中)
32 0
|
1月前
|
JavaScript
uni-app中关于格式化时间的js文件
uni-app中关于格式化时间的js文件
30 0
|
15天前
|
JavaScript 前端开发
JavaScript 中如何检测一个变量是一个 String 类型?
JavaScript 中如何检测一个变量是一个 String 类型?
21 2
|
1天前
|
JavaScript 前端开发 安全
JavaScript DOM 操作:解释一下浏览器的同源策略。
**同源策略**是浏览器安全基石,它阻止脚本跨不同协议、域名或端口访问资源,防止恶意行为。例如,HTTP页面无法直接用JS获取HTTPS页面内容。**CORS**允许跨域请求,但需服务器配合设置,通过`document.domain`属性可配置,但仍受限于服务器配置。
9 4
|
8天前
|
JavaScript
【归总】原生js操作浏览器hash、url参数参数获取/修改方法合集
【归总】原生js操作浏览器hash、url参数参数获取/修改方法合集
|
13天前
|
存储 JavaScript 前端开发
在浏览器中存储数组和对象(js的问题)
在浏览器中存储数组和对象(js的问题)
JS+CSS随机点名详细介绍复制可用(可自己添加人名)
JS+CSS随机点名详细介绍复制可用(可自己添加人名)