Navigator对象,screen对象

最新推荐文章于 2023-05-17 22:46:33 发布
最新推荐文章于 2023-05-17 22:46:33 发布
阅读量175 收藏
点赞数
分类专栏： 笔记 文章标签： js
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/ENDEAVOR__/article/details/108774039
版权

navigator对象 userAgent 浏览器检测 屏幕信息 分辨率
关键词由CSDN通过智能技术生成

Navigator对象

Navigator 对象包含有关浏览器的信息，通常用于检测浏览器与操作系统的版本。

对象属性:
在这里插入图片描述
查看浏览器的名称和版本，代码如下:

<script type="text/javascript">
   var browser=navigator.appName;
   var b_version=navigator.appVersion;
   document.write("Browser name"+browser);
   document.write("<br>");
   document.write("Browser version"+b_version);
</script>

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script>
			var browser = navigator.appName;
			var b_version = navigator.appVersion;
			document.write("Browser name"+browser);
			document.write("<br />");
			document.write("Browser version"+b_version);
		</script>
	</head>
	<body>
		
	</body>
</html>

userAgent

返回用户代理头的字符串表示(就是包括浏览器版本信息等的字符串)

语法

navigator.userAgent

几种浏览的user_agent.，像360的兼容模式用的是IE、极速模式用的是chrom的内核。
在这里插入图片描述
使用userAgent判断使用的是什么浏览器(假设使用的是IE8浏览器),代码如下:

function validB(){ 
  var u_agent = navigator.userAgent; 
  var B_name="Failed to identify the browser"; 
  if(u_agent.indexOf("Firefox")>-1){ 
      B_name="Firefox"; 
  }else if(u_agent.indexOf("Chrome")>-1){ 
      B_name="Chrome"; 
  }else if(u_agent.indexOf("MSIE")>-1&&u_agent.indexOf("Trident")>-1){ 
      B_name="IE(8-10)";  
  }
    document.write("B_name:"+B_name+"<br>");
    document.write("u_agent:"+u_agent+"<br>"); 
}

运行结果:
在这里插入图片描述

screen对象

screen对象用于获取用户的屏幕信息。

语法：

window.screen.属性

对象属性:
在这里插入图片描述
屏幕分辨率的高和宽
window.screen 对象包含有关用户屏幕的信息。

  1. screen.height 返回屏幕分辨率的高
  2. screen.width 返回屏幕分辨率的宽

注意:
1.单位以像素计。
2. window.screen 对象在编写时可以不使用 window 这个前缀。 我们来获取屏幕的高和宽，代码如下:

<script type="text/javascript">
  document.write( "屏幕宽度："+screen.width+"px<br />" );
  document.write( "屏幕高度："+screen.height+"px<br />" );
</script>

屏幕可用高和宽度

  1. screen.availWidth 属性返回访问者屏幕的宽度，以像素计，减去界面特性，比如任务栏。

  2. screen.availHeight 属性返回访问者屏幕的高度，以像素计，减去界面特性，比如任务栏。

注意:

不同系统的任务栏默认高度不一样，及任务栏的位置可在屏幕上下左右任何位置，所以有可能可用宽度和高度不一样。

我们来获取屏幕的可用高和宽度，代码如下：

<script type="text/javascript">
document.write("可用宽度：" + screen.availWidth);
document.write("可用高度：" + screen.availHeight);
</script>

注意:根据屏幕的不同显示值不同。

鱼还在鱼塘里
关注
专栏目录
JavaScript【节流(throttle)、Navigator 对象、Screen 对象】(十七)
08-16 221
JavaScript【节流(throttle)、Navigator 对象、Screen 对象】(十七)
Navigator 对象，Screen 对象。
web前端开发
03-07 293
作者 | 阮一峰window.navigator属性指向一个包含浏览器和系统信息的 Navigator 对象。脚本通过这个属性了解用户的环境信息。1、Navigator 对象的属性1.1...
webx工程tomcat启动报错 ( 方案不能包含具有相同名称的两个全局组件; 而此方案中包含两个)
xiaojie19871116的博客
07-08 2299
webx工程tomcat启动报错 2012-06-15, 15:09 UTC, #1 jql294671405   Junior Member 帖子: 14 6 加入时间: 2012-05  声望: 0 webx工程tomcat启动报错 webx工程maven 打
React-navigation导航系统(2)
大灰狼的小绵羊哥哥的博客
05-08 5528
tags: React-native Navigators http://www.jianshu.com/p/8b38d1b654f9 Navigators允许你定义你的导航结构.Navigators也可以渲染普通的元素,例如你配置好的header和tab bar. navigators可以是单纯的React组件. 内建的Navigators react-navig
A schema cannot contains two global components with the same name
02-03 1145
问题描述：                  在spring+mongodb项目中的applicationContext.xml中有报警，在Problems视图中查到的详情是：A schema cannot contains two global components with the same name；this schema  contains two occurences of 'http
React Native开发错误警告处理总结
梦家之家
06-15 7878
注：本文是我在开发过程中遇到问题解决方法的总结，之后会持续更新，希望帮助到更多的学习者。文中有不妥的地方希望指出共同学习，同时欢迎大神补充。错误1：Paste_Image.png估计是程序中有格式错误请自行检查比如：你注释出来问题。{/*title="张三"*/}换//title="张三"错误2：Paste_Image.png这个说明你要跳转的页面缺少子控件。所以你要在里面添加东西比如加个：&lt...
BOM的navigator对象
qq_42801406的博客
11-06 256
1.作用 识别客户端浏览器 2.检测插件 使用plugins数组来检测是否安装了特定的插件。 在IE浏览器中使用IEPlugin检测。 3.注册处理程序 registerContentHendler()方法和registeerProtocolHandler()方法可以让一个站点指明它可以处理特定类型的信息。 4.screen对象 screen对象只用来表达客户端的能力，其中包括浏览器外部窗口的显示...
js中的navigator对象和screen对象
个人笔记
03-26 215
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <body> </body> </html> <script type="text/javascript"> //navigator 用于检测浏览器内核操作系统的信息 console.log(navigat
js对象层次• navigator •screen•window
12-25
在提供的信息中，我们关注三个主要的对象：`navigator`、`screen`和`window`，以及它们关联的一些子对象。 `navigator`对象是关于用户浏览器的信息库，提供了如浏览器名称、版本、平台和是否支持Java等属性。例如，...
【温故而知新】JavaScript的BOM之Navigator对象.md
最新发布
06-13
- **Screen对象**：提供有关用户屏幕的信息，如屏幕尺寸、颜色深度等。 - **Document对象**：代表当前加载的文档（通常是HTML页面），是DOM（Document Object Model）的一部分。 #### 二、Navigator对象详解 **...
11-BOM-概述和组成对象（window、history、location、navigator、screen、document）
记录java学习日常~
05-17 965
BOM（Browser Object Model）是浏览器对象模型的缩写，指的是由浏览器提供的一组对象和方法，可以通过JavaScript来操作和管理浏览器。全局作用域：Window对象是全局对象，它包含了所有的JavaScript变量和函数。因此，可以在脚本的任何地方访问和修改Window对象的属性和方法。对象层次结构：如果窗口中嵌套了框架，则每个框架都是一个Window对象。Window对象形成了一个对象层次结构，可以通过Window的属性和方法来访问和操作其中的文档和元素。
js实现操作成功之后自动跳转页面
你难忘的
09-24 8337
如图所示样子： 制作一个跳转提示页面： 要求： 1. 如果打开该页面后，如果不做任何操作则5秒后自动跳转到一个新的地址，如慕课网主页。 2. 如果点击“返回”按钮则返回前一个页面 <!DOCTYPE html> <html> <head> <title>浏览器对象</title> <meta http-equiv="Content-Type" content="text/html; charset=gkb"/>
JS中数组排序sort()
你难忘的
09-24 2918
sort()方法使数组中的元素按照一定的顺序排列。 语法: arrayObject.sort(方法函数) 参数说明： 1.如果不指定<方法函数>，则按unicode码顺序排列。 2.如果指定<方法函数>，则按<方法函数>所指定的排序方法排序。 myArray.sort(sortMethod); 注意: 该函数要比较两个值，然后返回一个用于说明这两个值的相对顺序的数字。比较函数应该具有两个参数 a 和 b，其返回值如下： 若返回值<=-1，则表示 A 在排序后的
js中的History 对象
你难忘的
09-24 2126
History 对象 history对象记录了用户曾经浏览过的页面(URL)，并可以实现浏览器前进与后退相似导航的功能。 注意:从窗口被打开的那一刻开始记录，每个浏览器窗口、每个标签页乃至每个框架，都有自己的history对象与特定的window对象关联。 语法： window.history.[属性|方法] 注意：window可以省略。 History 对象属性 History 对象方法 使用length属性，当前窗口的浏览历史总长度，代码如下： <script type="text/java
JavaScript 计时器
你难忘的
09-24 2091
在JavaScript中，我们可以在设定的时间间隔之后来执行代码，而不是在函数被调用后立即执行。 计时器类型： 一次性计时器：仅在指定的延迟时间之后触发一次。 间隔性触发计时器：每隔一定的时间间隔就触发一次。 计时器方法： 计时器setInterval() 在执行时,从载入页面后每隔指定的时间执行代码。 语法: setInterval(代码,交互时间); 参数说明： 1. 代码：要调用的函数或要执行的代码串。 2. 交互时间：周期性执行或调用表达式之间的时间间隔，以毫秒计（1s=1000ms）。 返回
vue实现点击列表第一个变色其他不变色
你难忘的
11-09 1238
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <style> .active{ color: red; } </style> </head> <body> <div id="app"> <h1 v-fo
制作一个表格，显示班级的学生信息。
你难忘的
09-25 961
制作一个表格，显示班级的学生信息。 要求： 鼠标移到不同行上时背景色改为色值为 #f2f2f2，移开鼠标时则恢复为原背景色 #fff 点击添加按钮，能动态在最后添加一行 点击删除按钮，则删除当前行 <!DOCTYPE html> <html> <head> <title> new document </title> <meta http-equiv="Content-Type" content="text/h.
JavaScript Navigator与Window对象详解
在JavaScript中，Navigator对象和Window对象是两个非常重要的内置对象，它们提供了关于用户浏览器和窗口环境的大量信息和功能。 Navigator对象是JavaScript访问浏览器信息的主要接口，它提供了以下属性和方法： **...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

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

余额充值