JavaScript Window Navigator
window.navigator 对象包含有关访问者的信息。
Window Navigator
window.navigator 对象可以不带 window 前缀来写。
一些例子:
- navigator.appName
- navigator.appCodeName
- navigator.platform
浏览器 Cookie
cookieEnabled 属性返回 true,如果 cookie 已启用,否则返回 false:
<!DOCTYPE html>
<html>
<body>
<h1>Navigator 对象</h1>
<p>如果启用了 cookie,则 cookieEnabled 属性返回 true:</p>
<p id="demo">
<script>
document.getElementById("demo").innerHTML =
"navigator.cookieEnabled 是:" + navigator.cookieEnabled;
</script>
</body>
</html>
浏览器应用程序名称
appName 属性返回浏览器的应用程序名称:
<!DOCTYPE html>
<html>
<body>
<h1>Navigator 对象</h1>
<p>appName 属性返回浏览器的应用程序名称:</p>
<p id="demo">
<p>奇怪的是,“Netscape” 是 IE11、Chrome、Firefox 和 Safari 的应用程序名称。</p>
<script>
document.getElementById("demo").innerHTML =
"navigator.appName 是:" + navigator.appName;
</script>
</body>
</html>
很陌生吧,"Netscape" 是 IE11、Chrome、Firefox 以及 Safari 的应用程序名称的统称。
浏览器应用程序代码名称
appCodeName 属性返回浏览器的应用程序代码名称:
<!DOCTYPE html>
<html>
<body>
<h1>JavaScript Navigator 对象</h1>
<p>appCodeName 属性返回浏览器的代码名称。</p>
<p>不要依赖它! “Mozilla” 是 Chrome、Firefox、IE、Safari 和 Opera 的应用程序代码名称。</p>
<p id="demo">
<script>
document.getElementById("demo").innerHTML =
"navigator.appCodeName is " + navigator.appCodeName;
</script>
</body>
</html>
"Mozilla" 是 Chrome、Firefox、IE、Safari 以及 Opera 的应用程序代码名称。
浏览器引擎
product 属性返回浏览器引擎的产品名称:
<!DOCTYPE html>
<html>
<body>
<h1>Navigator 对象</h1>
<p>product 属性返回浏览器的产品名称。</p>
<p>不要依赖它!大多数浏览器都将 “Gecko” 作为产品名称返回!</p>
<p id="demo">
<script>
document.getElementById("demo").innerHTML =
"navigator.product 是:" + navigator.product;
</script>
</body>
</html>
浏览器版本
appVersion 属性返回有关浏览器的版本信息:
<!DOCTYPE html>
<html>
<body>
<h1>Navigator 对象</h1>
<p>appVersion 属性返回有关浏览器的版本信息:</p>
<p id="demo">
<script>
document.getElementById("demo").innerHTML = navigator.appVersion;
</script>
</body>
</html>
浏览器代理
userAgent 属性返回由浏览器发送到服务器的用户代理报头(user-agent header):
<!DOCTYPE html>
<html>
<body>
<h1>Navigator 对象</h1>
<p>userAgent 属性返回浏览器发送给服务器的用户代理标头:</p>
<p id="demo">
<script>
document.getElementById("demo").innerHTML =
navigator.userAgent;
</script>
</body>
</html>
注意事项
来自 navigator 对象的信息通常是误导性的,不应该用于检测浏览器版本,因为:
- 不同浏览器能够使用相同名称
- 导航数据可被浏览器拥有者更改
- 某些浏览器会错误标识自身以绕过站点测试
- 浏览器无法报告发布晚于浏览器的新操作系统
浏览器平台
platform 属性返回浏览器平台(操作系统):
<!DOCTYPE html>
<html>
<body>
<h1>Navigator 对象</h1>
<p>platform 属性返回浏览器平台(操作系统):</p>
<p id="demo">
<script>
document.getElementById("demo").innerHTML =
"navigator.platform 是:" + navigator.platform;
</script>
</body>
</html>
浏览器语言
language 属性返回浏览器语言:
<!DOCTYPE html>
<html>
<body>
<h1>Navigator 对象</h1>
<p>language 属性返回浏览器的语言:</p>
<p id="demo">
<script>
document.getElementById("demo").innerHTML =
"navigator.language 是:" + navigator.language;
</script>
</body>
</html>
浏览器是否在线?
onLine 属性返回 true,假如浏览器在线:
<!DOCTYPE html>
<html>
<body>
<h1>Navigator 对象</h1>
<p>如果浏览器在线,则 onLine 属性返回 true:</p>
<p id="demo">
<script>
document.getElementById("demo").innerHTML =
"navigator.onLine 是:" + navigator.onLine;
</script>
</body>
</html>
判断是否是移动端浏览器
用 javascript 判断是PC端还是移动端,可以根据不同情况,执行不同的操作。
<!DOCTYPE html>
<html>
<body>
<h1>Navigator 对象</h1>
<p>如果浏览器在线,则 onLine 属性返回 true:</p>
<p id="demo">
<script>
// 判断是否为移动端
if( /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent) ) {
document.write("移动")
} else {
document.write("PC")
}
</script>
</body>
</html>
当然,还可以在上述例子的基础上,判断是安卓浏览器还是IOS浏览器。
var u = navigator.userAgent;
var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/);
if(isiOS){
console.log("IOS");
}else{
console.log("安卓");
}