美文网首页JavaScript 进阶营
JavaScriptBOM_Navigator_Screen(二

JavaScriptBOM_Navigator_Screen(二

作者: 终身成长人格 | 来源:发表于2019-11-29 15:58 被阅读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 对象包含有关用户屏幕的信息。

  1. screen.height 返回屏幕分辨率的高
  2. screen.width 返回屏幕分辨率的宽
    注意:
    1.单位以像素计。
  3. 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>

屏幕可用高和宽度

  1. screen.availWidth 属性返回访问者屏幕的宽度,以像素计,减去界面特性,比如任务栏。
  2. 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>

下节预告:BOM_定时器_setInterval_clearInterval_setTimeout

参考视频教程:https://www.3mooc.com/front/couinfo/228

相关文章

  • JavaScriptBOM_Navigator_Screen(二

    目录: 1.Navigator对象2.Screen对象 一、Navigator对象 1.什么是Navigator对...

  • 二(二)

    发什么神经 突然就很想花钱 一边心疼 一边毫不在乎的花 啧 莫名其妙

  • 二,二

    2017.9.11教师节后的周一,第一次走进教室,刚站到讲台两个小可爱送给我两束花,原谅我那时候人还没有认全没有记...

  • 二〇二〇

    本来这篇小结打算年初写的,但是想想后边还有复试就先放一放,结果复试结束后过了两个月才想起要写这篇小结... 时过境...

  • 二金二木二火二土

    今天看完了极简中国史,这本书看了半个多月,因为是八十年前写的书,不是白话文,所以看的特别累。不过从近代前辈的角度去...

  • 说二『似二非二的二』

    说实话原以为他最多似二,生活小节或许专门学着似二,中枢神经应该不至于非二,没想到最近越来越疯狂地绞尽脑汁地朝着二的...

  • 二胎(二)

    今天宝宝三十周了,还有十周你就要出来了,也许会提前,妈妈和家人都很期待。 到了孕晚期,睡觉是个问题,左睡右睡都不对...

  • 二小姐(二)

    我去了李家,那环境好,夫人老爷小姐都很和蔼,我正坐在由木头和瓷做的椅子上,正等待着女管家来接我,我人生地不熟...

  • 二、递归(二)

    一、棋盘分割问题 【每次切完一个棋盘,就是需要舍弃掉一面,只能在一面操作】

  • 二选二

    既然已经分手了,那就应该正视我们的故事。待成熟睿智的甘露填补满年少轻狂的洼壑,你再回过头来,促膝把酒花前月下也能...

网友评论

    本文标题:JavaScriptBOM_Navigator_Screen(二

    本文链接:https://www.haomeiwen.com/subject/fvjgwctx.html