浏览器中的JavaScript核心BOM(浏览器对象模型)对象Navigator和Screen的简单了解

javascript 专栏收录该内容
26 篇文章 5 订阅

浏览器中内置对象Navigator和对象Screen的简单了解

引言

想必大家很奇怪,为什么本文是简单了解。其实BOM虽然提供了很多对象供我们去使用,但是有些对象其实是不那么重要的,例如本文要将的两个对象——Navigator和Screen。所以大家只需要看一看,了解一下有这样的属性和用法就可以啦

  • 公众号:前端印象
  • 不定时有送书活动,记得关注~
  • 关注后回复对应文字领取:【面试题】、【前端必看电子书】、【数据结构与算法完整代码】、【前端技术交流群】

正文

一、Navigator对象

Navigator对象主要是用来帮助我们获取浏览器的一些信息的,例如浏览器的名称 、浏览器编译版本 、浏览器的语言 、浏览器使用的插件信息…… 并且该对象被所有支持javascript语言的浏览器支持,每个浏览器中的navigator对象都有一套自己的属性,所以我们就来列举一些大多数浏览器都通用的Navigator对象的属性吧

属性描述
appName完整的浏览器名称
appVersion浏览器的版本
userAgent浏览器的用户代理字符串
platform浏览器所在的系统平台
cookieEnabled表示cookie是否被启用
plugins浏览器中所安装的插件信息数组

这里我就直接放上图给大家看,大家也可以自己用浏览器去进行尝试

在这里插入图片描述

二、Screen对象

该对象可以获取浏览器窗口外部显示器的信息,例如像素宽度和高度之类的。那因为每个浏览器的Screen对象都有他们各自支持和不支持的属性,那我在这里就列举所有浏览器的支持的属性给大家,如果有想深入研究的可以去搜索更多的属性,以及他们的版本支持

属性描述
availHeight屏幕的像素高度减系统部件的高度之后的值(只读)
availWidth屏幕的像素宽度减系统部件的宽度之后的值(只读)
colorDepth用于表示颜色的位数(只读)
height屏幕的像素高度
width屏幕的像素宽度

这里讲解一下 availHeight 和 height 的区别,前者是不把系统的任务栏的高度算在内的;后者是屏幕的高度。

这个就是系统的任务栏
在这里插入图片描述

结束语

好了,这两个简单的对象就了解到这里。虽然这两个对象很简单,但是还希望大家将一些别的核心的对象给了解透彻。我也写过其他对象的文章,比如window对象 、 location对象 、history对象,大家可以去翻阅我的文章。

  • 2
    点赞
  • 1
    评论
  • 1
    收藏
  • 一键三连
    一键三连
  • 扫一扫,分享海报

<p> <span style="font-family:-apple-system, system-ui, 'PingFang SC', Helvetica, Tahoma, Arial, 'Microsoft YaHei', 微软雅黑, 黑体, Heiti, sans-serif, SimSun, 宋体, serif;font-size:12px;background-color:#ffffff;">1、系统全面介绍了Python的基础语法 </span> </p> <p> <span style="font-family:-apple-system, system-ui, 'PingFang SC', Helvetica, Tahoma, Arial, 'Microsoft YaHei', 微软雅黑, 黑体, Heiti, sans-serif, SimSun, 宋体, serif;font-size:12px;background-color:#ffffff;">2、在课程融入了算法思想 </span> </p> <p> <span style="font-family:-apple-system, system-ui, 'PingFang SC', Helvetica, Tahoma, Arial, 'Microsoft YaHei', 微软雅黑, 黑体, Heiti, sans-serif, SimSun, 宋体, serif;font-size:12px;background-color:#ffffff;">3、帮助初学者厘清逻辑,掌握Python的主体脉络 </span> </p> <p> <span style="font-family:-apple-system, system-ui, 'PingFang SC', Helvetica, Tahoma, Arial, 'Microsoft YaHei', 微软雅黑, 黑体, Heiti, sans-serif, SimSun, 宋体, serif;font-size:12px;background-color:#ffffff;">4、从全方位立体角度解析知识点 </span> </p> <p> <span style="font-family:-apple-system, system-ui, 'PingFang SC', Helvetica, Tahoma, Arial, 'Microsoft YaHei', 微软雅黑, 黑体, Heiti, sans-serif, SimSun, 宋体, serif;font-size:12px;background-color:#ffffff;">5、实战案例驱动、课程包含近200个相关案例、边讲解边实操</span> </p> <p> <span style="font-family:-apple-system, system-ui, 'PingFang SC', Helvetica, Tahoma, Arial, 'Microsoft YaHei', 微软雅黑, 黑体, Heiti, sans-serif, SimSun, 宋体, serif;font-size:12px;background-color:#ffffff;"><br /> </span> </p> <p> <span style="font-family:-apple-system, system-ui, 'PingFang SC', Helvetica, Tahoma, Arial, 'Microsoft YaHei', 微软雅黑, 黑体, Heiti, sans-serif, SimSun, 宋体, serif;font-size:12px;background-color:#ffffff;"><img src="https://img-bss.csdnimg.cn/202107120808123109.png" alt="" /><br /> </span> </p>
©️2021 CSDN 皮肤主题: 博客之星2020 设计师:CY__ 返回首页
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值