检测Safari浏览器
如何使用JavaScript检测Safari浏览器? 我已经尝试下面的代码,它不仅检测Safari,但也Chrome浏览器。
function IsSafari() { var is_safari = navigator.userAgent.toLowerCase().indexOf('safari/') > -1; return is_safari; }
您可以轻松使用Chrome的索引来过滤Chrome:
var ua = navigator.userAgent.toLowerCase(); if (ua.indexOf('safari') != -1) { if (ua.indexOf('chrome') > -1) { alert("1") // Chrome } else { alert("2") // Safari } }
请注意:总是尝试检测您尝试修复的具体行为,而不是使用isSafari?
来定位它isSafari?
作为最后的手段,用这个正则expression式来检测Safari:
var isSafari = /^((?!chrome|android).)*safari/i.test(navigator.userAgent);
它使用反面查找 ,并且不包括Chrome,Edge和所有包含Safari
用户代理中的Safari
名称的Android浏览器。
正如其他人已经注意到的,特征检测优于检查特定的浏览器。 一个原因是用户代理string可以被修改。 另一个原因是string可能会更改并在新版本中破坏您的代码。
如果你仍然想要这样做,并testing任何Safari版本,我会build议使用这个
var isSafari = navigator.vendor && navigator.vendor.indexOf('Apple') > -1 && navigator.userAgent && !navigator.userAgent.match('CriOS');
这将适用于所有设备上的任何版本的Safari:Mac,iPhone,iPod,iPad。
编辑
要在您当前的浏览器中进行testing: https : //jsfiddle.net/urc9azg5/3/
编辑2
根据Chrome文档进行更新,以正确检测iOS上的Chrome
值得注意的是,iOS上的所有浏览器只是Safari的包装器,并使用相同的引擎。 请参阅bfred.it对此主题中自己的答案的评论。
此代码仅用于检测Safari浏览器
if (navigator.userAgent.search("Safari") >= 0 && navigator.userAgent.search("Chrome") < 0) { alert("Browser is Safari"); }
只要使用:
var isSafari = window.safari !== undefined; if (isSafari) console.log("Safari, yeah!");
因为chrome和safari的userAgent几乎相同,所以浏览器的供应商可能更容易一些
苹果浏览器
navigator.vendor == "Apple Computer, Inc."
铬
navigator.vendor == "Google Inc."
火狐 (为什么是空的?)
navigator.vendor == ""
IE (为什么没有定义?)
navigator.vendor == undefined
我用这个
function getBrowserName() { var name = "Unknown"; if(navigator.userAgent.indexOf("MSIE")!=-1){ name = "MSIE"; } else if(navigator.userAgent.indexOf("Firefox")!=-1){ name = "Firefox"; } else if(navigator.userAgent.indexOf("Opera")!=-1){ name = "Opera"; } else if(navigator.userAgent.indexOf("Chrome") != -1){ name = "Chrome"; } else if(navigator.userAgent.indexOf("Safari")!=-1){ name = "Safari"; } return name; } if( getBrowserName() == "Safari" ){ alert("You are using Safari"); }else{ alert("You are surfing on " + getBrowserName(name)); }
只有Safari浏览器没有Chrome:
尝试其他代码后,我没有发现任何与新版本和旧版本的Safari一起工作。
最后,我做了这个对我来说工作得很好的代码:
var ua = navigator.userAgent.toLowerCase(); var isSafari = false; try { isSafari = /constructor/i.test(window.HTMLElement) || (function (p) { return p.toString() === "[object SafariRemoteNotification]"; })(!window['safari'] || safari.pushNotification); } catch(err) {} isSafari = (isSafari || ((ua.indexOf('safari') != -1)&& (!(ua.indexOf('chrome')!= -1) && (ua.indexOf('version/')!= -1)))); if (isSafari) { //Code for Safari Browser (Desktop and Mobile) }
var ua = navigator.userAgent.toLowerCase(); var isSafari = false; try { isSafari = /constructor/i.test(window.HTMLElement) || (function (p) { return p.toString() === "[object SafariRemoteNotification]"; })(!window['safari'] || safari.pushNotification); } catch(err) {} isSafari = (isSafari || ((ua.indexOf('safari') != -1)&& (!(ua.indexOf('chrome')!= -1) && (ua.indexOf('version/')!= -1)))); if (isSafari) { //Code for Safari Browser (Desktop and Mobile) document.getElementById('idbody').innerHTML = "This is Safari!"; } else { document.getElementById('idbody').innerHTML = "Not is Safari!"; }
<body id="idbody"> </body>
也许这工作:
Object.prototype.toString.call(window.HTMLElement).indexOf('Constructor')
编辑:不再工作
上面的答案修改正则expression式
var isSafari = /^((?!chrome|android|crios|fxios).)*safari/i.test(navigator.userAgent);
- crios – Chrome
- fxios – Firefox