JavaScriptBOM_Navigator_Screen（二
2019-11-29 本文已影响0人
终身成长人格
目录：
1.Navigator对象
2.Screen对象
一、Navigator对象
1.什么是Navigator对象？
Navigator 对象包含有关浏览器的信息。
注释：没有应用于 navigator 对象的公开标准，不过所有浏览器都支持该对象。
2.Navigator对象的使用
Navigator对象代表当前浏览器的信息，通过该对象可以识别不同的浏览器
由于历史原因，Navigator对象中大部分的属性已经不能帮我们识别浏览器信息了
一般我们只用userAgent来判断浏览器的信息
userAgent是一个字符串，这个字符串包含了来描述浏览器信息的内容
不同的浏览器会有不同的userAgent
如果不能通过userAgent来判断，还可以通过浏览器中一些特有的对象，来判断浏览器信息
var user = navigator.userAgent;
if(/Firefox/i.test(user)){
alert('火狐浏览器');
}else if(/Chrome/i.test(user)){
alert('谷歌浏览器');
}else if('ActiveXObject' in window){
alert('ie浏览器');
}
二、Screen对象
1.什么是Screen对象
Screen 对象包含有关客户端显示屏幕的信息。
注释：没有应用于 screen 对象的公开标准，不过所有浏览器都支持该对象。
2.Screen对象的使用
屏幕分辨率的高和宽
window.screen 对象包含有关用户屏幕的信息。
- screen.height 返回屏幕分辨率的高
- screen.width 返回屏幕分辨率的宽
注意:
1.单位以像素计。 - window.screen 对象在编写时可以不使用 window 这个前缀。
我们来获取屏幕的高和宽，代码如下:
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>屏幕分辨率的高和宽</title>
</head>
<body>
<script type="text/javascript">
document.write( "屏幕宽度：" + window.screen.width + "px<br/>" );
document.write( "屏幕高度：" + window.screen.height + "px");
</script>
</body>
</html>
屏幕可用高和宽度
- screen.availWidth 属性返回访问者屏幕的宽度，以像素计，减去界面特性，比如任务栏。
- screen.availHeight 属性返回访问者屏幕的高度，以像素计，减去界面特性，比如任务栏。
注意:
不同系统的任务栏默认高度不一样，及任务栏的位置可在屏幕上下左右任何位置，所以有可能可用宽度和高度不一样。
我们来获取屏幕的可用高和宽度，代码如下：
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>屏幕分辨率的高和宽</title>
</head>
<body>
<script type="text/javascript">
document.write("可用宽度：" + window.screen.availWidth + "px<br/>");
document.write("可用高度：" + window.screen.availHeight +"px");
</script>
</body>
</html>
