JavaScript navigator.userAgent獲取瀏覽器信息案例講解
瀏覽器對于我們來說,可能是最熟悉的工具了。熟知的瀏覽器Firefox、Opera、Safari、IE、Chrome以外,據(jù)說世界上還有近百種瀏覽器。通常在開發(fā)的時候要做到兼容各種瀏覽器,因此提煉出判斷瀏覽器類型及系統(tǒng)是很重要的。
先來看看什么是User-Agent?User-Agent是HTTP請求中的用戶標識,一般發(fā)送一個能夠代表客戶端類型的字符串,比如瀏覽器類型 操作系統(tǒng)等信息。User-Agent 的約定格式是:應(yīng)用名,跟一個斜線,跟版本號,剩下的是自由的格式。
此處我只實例展示幾個瀏覽器
Chrome
iphone的safari
IE
接下來封裝了獲取瀏覽類型與系統(tǒng)的函數(shù),之后在需要的地方進行調(diào)用即可
// 各主流瀏覽器 function getBrowser() { var u = navigator.userAgent; var bws = [{ name: 'sgssapp', it: /sogousearch/i.test(u) }, { name: 'wechat', it: /MicroMessenger/i.test(u) }, { name: 'weibo', it: !!u.match(/Weibo/i) }, { name: 'uc', it: !!u.match(/UCBrowser/i) || u.indexOf(' UBrowser') > -1 }, { name: 'sogou', it: u.indexOf('MetaSr') > -1 || u.indexOf('Sogou') > -1 }, { name: 'xiaomi', it: u.indexOf('MiuiBrowser') > -1 }, { name: 'baidu', it: u.indexOf('Baidu') > -1 || u.indexOf('BIDUBrowser') > -1 }, { name: '360', it: u.indexOf('360EE') > -1 || u.indexOf('360SE') > -1 }, { name: '2345', it: u.indexOf('2345Explorer') > -1 }, { name: 'edge', it: u.indexOf('Edge') > -1 }, { name: 'ie11', it: u.indexOf('Trident') > -1 && u.indexOf('rv:11.0') > -1 }, { name: 'ie', it: u.indexOf('compatible') > -1 && u.indexOf('MSIE') > -1 }, { name: 'firefox', it: u.indexOf('Firefox') > -1 }, { name: 'safari', it: u.indexOf('Safari') > -1 && u.indexOf('Chrome') === -1 }, { name: 'qqbrowser', it: u.indexOf('MQQBrowser') > -1 && u.indexOf(' QQ') === -1 }, { name: 'qq', it: u.indexOf('QQ') > -1 }, { name: 'chrome', it: u.indexOf('Chrome') > -1 || u.indexOf('CriOS') > -1 }, { name: 'opera', it: u.indexOf('Opera') > -1 || u.indexOf('OPR') > -1 }]; for (var i = 0; i < bws.length; i++) { if (bws[i].it) { return bws[i].name; } } return 'other'; } // 系統(tǒng)區(qū)分 function getOS() { var u = navigator.userAgent; if (!!u.match(/compatible/i) || u.match(/Windows/i)) { return 'windows'; } else if (!!u.match(/Macintosh/i) || u.match(/MacIntel/i)) { return 'macOS'; } else if (!!u.match(/iphone/i) || u.match(/Ipad/i)) { return 'ios'; } else if (!!u.match(/android/i)) { return 'android'; } else { return 'other'; } }
到此這篇關(guān)于JavaScript navigator.userAgent獲取瀏覽器信息案例講解的文章就介紹到這了,更多相關(guān)JavaScript navigator.userAgent獲取瀏覽器信息內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
uniapp介紹與使用以及小程序?qū)崟r獲取視頻播放時間
這篇文章主要給大家介紹了關(guān)于uniapp介紹與使用以及小程序?qū)崟r獲取視頻播放時間的相關(guān)資料,文中通過實例代碼介紹的非常詳細,對大家學(xué)習或者使用uniapp具有一定的參考學(xué)習價值,需要的朋友可以參考下2023-02-02