PPK提供的浏览器类型及版本检测方法

简介: 一个常用但是被高估的Javascript函数就是浏览器检测。有些时候,你想给出一个说明或者加载一个页面来提示用户,以免使用Safari等浏览器。 使用方法: Browser name: BrowserDetect.

      一个常用但是被高估的Javascript函数就是浏览器检测。有些时候,你想给出一个说明或者加载一个页面来提示用户,以免使用Safari等浏览器。

使用方法:

Browser name: BrowserDetect.browser 
Browser version: BrowserDetect.version 
OS name: BrowserDetect.OS 

 

var  BrowserDetect  =  {
    init: 
function  () {
        
this .browser  =   this .searchString( this .dataBrowser)  ||   " An unknown browser " ;
        
this .version  =   this .searchVersion(navigator.userAgent)
            
||   this .searchVersion(navigator.appVersion)
            
||   " an unknown version " ;
        
this .OS  =   this .searchString( this .dataOS)  ||   " an unknown OS " ;
    },
    searchString: 
function  (data) {
        
for  ( var  i = 0 ;i < data.length;i ++ )    {
            
var  dataString  =  data[i].string;
            
var  dataProp  =  data[i].prop;
            
this .versionSearchString  =  data[i].versionSearch  ||  data[i].identity;
            
if  (dataString) {
                
if  (dataString.indexOf(data[i].subString)  !=   - 1 )
                    
return  data[i].identity;
            }
            
else   if  (dataProp)
                
return  data[i].identity;
        }
    },
    searchVersion: 
function  (dataString) {
        
var  index  =  dataString.indexOf( this .versionSearchString);
        
if  (index  ==   - 1 return ;
        
return  parseFloat(dataString.substring(index + this .versionSearchString.length + 1 ));
    },
    dataBrowser: [
        {
            string: navigator.userAgent,
            subString: 
" Chrome " ,
            identity: 
" Chrome "
        },
        {     string: navigator.userAgent,
            subString: 
" OmniWeb " ,
            versionSearch: 
" OmniWeb/ " ,
            identity: 
" OmniWeb "
        },
        {
            string: navigator.vendor,
            subString: 
" Apple " ,
            identity: 
" Safari " ,
            versionSearch: 
" Version "
        },
        {
            prop: window.opera,
            identity: 
" Opera "
        },
        {
            string: navigator.vendor,
            subString: 
" iCab " ,
            identity: 
" iCab "
        },
        {
            string: navigator.vendor,
            subString: 
" KDE " ,
            identity: 
" Konqueror "
        },
        {
            string: navigator.userAgent,
            subString: 
" Firefox " ,
            identity: 
" Firefox "
        },
        {
            string: navigator.vendor,
            subString: 
" Camino " ,
            identity: 
" Camino "
        },
        {        
//  for newer Netscapes (6+)
            string: navigator.userAgent,
            subString: 
" Netscape " ,
            identity: 
" Netscape "
        },
        {
            string: navigator.userAgent,
            subString: 
" MSIE " ,
            identity: 
" Explorer " ,
            versionSearch: 
" MSIE "
        },
        {
            string: navigator.userAgent,
            subString: 
" Gecko " ,
            identity: 
" Mozilla " ,
            versionSearch: 
" rv "
        },
        {         
//  for older Netscapes (4-)
            string: navigator.userAgent,
            subString: 
" Mozilla " ,
            identity: 
" Netscape " ,
            versionSearch: 
" Mozilla "
        }
    ],
    dataOS : [
        {
            string: navigator.platform,
            subString: 
" Win " ,
            identity: 
" Windows "
        },
        {
            string: navigator.platform,
            subString: 
" Mac " ,
            identity: 
" Mac "
        },
        {
               string: navigator.userAgent,
               subString: 
" iPhone " ,
               identity: 
" iPhone/iPod "
        },
        {
            string: navigator.platform,
            subString: 
" Linux " ,
            identity: 
" Linux "
        }
    ]

};
BrowserDetect.init();
相关文章
|
1月前
|
JavaScript 前端开发 开发者
如何检测浏览器是否支持最新的 image lazy loading 特性
如何检测浏览器是否支持最新的 image lazy loading 特性
21 0
|
1月前
|
前端开发 JavaScript 开发者
什么是浏览器对象的 preventDefault 方法
什么是浏览器对象的 preventDefault 方法
35 1
|
1月前
|
Web App开发 前端开发
Chrome 浏览器插件 V3 版本 Manifest.json 文件中 Action 的类型(Types)、方法(Methods)和事件(Events)的属性和参数解析
Chrome 浏览器插件 V3 版本 Manifest.json 文件中 Action 的类型(Types)、方法(Methods)和事件(Events)的属性和参数解析
174 0
|
1月前
|
Web App开发
Google Chrome 浏览器 119.0.6045.106 版本提示 STATUS_INVALID_IMAGE_HASH 崩溃
Google Chrome 浏览器 119.0.6045.106 版本提示 STATUS_INVALID_IMAGE_HASH 崩溃
83 0
|
1月前
|
JavaScript 前端开发
JavaScript DOM 操作:如何检测浏览器是否支持某个特性?
【4月更文挑战第15天】使用Modernizr库检测浏览器特性:添加 `<script src="https://cdnjs.cloudflare.com/ajax/libs/modernizr/2.8.3/modernizr.min.js"></script>` 到HTML,然后通过 `Modernizr.localstorage` 进行检测,如支持localStorage则执行相应代码,否则执行备用逻辑。
22 0
|
1月前
|
JavaScript
【归总】原生js操作浏览器hash、url参数参数获取/修改方法合集
【归总】原生js操作浏览器hash、url参数参数获取/修改方法合集
|
1月前
|
JavaScript 前端开发
JavaScript DOM 操作:如何检测浏览器是否支持某个特性?
JavaScript DOM 操作:如何检测浏览器是否支持某个特性?
30 0
|
1月前
|
Web App开发 移动开发 JavaScript
【Vue版】实现拖拽、排序效果(注意,这个方法在chrome谷歌浏览器上面不适用,dragend会情不自禁触发drag事件先执行,有点像浏览器的一个bug)
【Vue版】实现拖拽、排序效果(注意,这个方法在chrome谷歌浏览器上面不适用,dragend会情不自禁触发drag事件先执行,有点像浏览器的一个bug)
|
6月前
|
Web App开发
GOOGLE chrome浏览器 非插件截图方法
emm...不知道大家知不知道,反正不管怎么样,我就拿来水一下 打开chrome 哦~ 右键审查元素 or F12 or ctrl+shit+i or 你自己设置的快捷键... 然后再ctrl+shit+p
132 0
|
7月前
|
Web App开发 安全 网络安全
浏览器版本过高导致无法访问网站 burpSuiteBrowser
浏览器版本过高导致无法访问网站 burpSuiteBrowser
56 0