本文主要是介绍【JavaScript 漫游】【032】Navigator 对象和 Screen对象总结,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!
文章简介
本篇文章为【JavaScript 漫游】专栏的第 032 篇文章,对浏览器模型中 Navigator 对象和 Screen 对象的知识点进行了总结。
Navigator 对象
window.navigator
属性指向一个包含浏览器和系统信息的 Navigator 对象。脚本通过这个属性了解用户的环境信息。
Navigator.userAgent
返回浏览器的 User Agent 字符串,表示浏览器的厂商和版本信息。
Nagigator.plugins
返回一个类似数组的对象,成员是 Plugin 实例对象,表示浏览器安装的插件,比如 Flash、ActiveX 等。
var pluginsLength = navigator.plugins.length;for (var i = 0; i < pluginsLength; i++) {console.log(navigator.plugins[i].name);console.log(navigator.plugins[i].filename);console.log(navigator.plugins[i].description);console.log(navigator.plugins[i].version);
}
Navigator.platform
返回用户的操作系统信息,比如 MacIntel
、Win32
、Linux x86_64
等。
navigator.platform
// "Linux x86_64"
Navigator.onLine
返回一个布尔值,表示用户当前在线还是离线(浏览器断线)。
navigator.onLine // true
有时,浏览器可以连接局域网,但是局域网不能连通外网。这时,有的浏览器的onLine
属性会返回 true
,所以不能假定只要是 true
,用户就一定能访问互联网。不过,如果是 false
,可以断定用户一定离线。
用户变成在线会触发 online
事件,变成离线会触发 offline
事件,可以通过window.ononline
和 window.onoffline
指定这两个事件的回调函数。
window.addEventListener('offline', function(e) { console.log('offline'); });
window.addEventListener('online', function(e) { console.log('online'); });
Navigator.language
和 Navigator.languages
Navigator.language
属性返回一个字符串,表示浏览器的首选语言。该属性只读。
navigator.language // "en"
Navigator.languages
属性返回一个数组,表示用户可以接受的语言。Navigator.language
总是这个数组的第一个成员。HTTP 请求头信息的 Accept-Language
字段,就来自这个数组。
navigator.languages // ["en-US", "en", "zh-CN", "zh", "zh-TW"]
如果这个属性发生变化,就会在 window
对象上触发 languagechange
事件。
Navigator.geolocation
Navigator.geolocation
属性返回一个 Geolocation 对象,包含用户地理位置的信息。注意,该 API 只有在 HTTPS 协议下可用,否则调用下面方法时会报错。
Geolocation 对象提供下面三个方法。
- Geolocation.getCurrentPosition():得到用户的当前位置
- Geolocation.watchPosition():监听用户位置变化
- Geolocation.clearWatch():取消
watchPosition()
方法指定的监听函数
注意,调用这三个方法时,浏览器会跳出一个对话框,要求用户给予授权。
Navigator.cookieEnabled
返回一个布尔值,表示浏览器的 Cookie 功能是否打开。
navigator.cookieEnabled // true
注意,这个属性反映的是浏览器总的特性,与是否储存某个具体的网站的 Cookie 无关。用户可以设置某个网站不得储存 Cookie,这时 cookieEnabled
返回的还是 true
。
Navigator.sendBeacon()
Navigator.sendBeacon()
方法用于向服务器异步发送数据。
Screen 对象
Screen
对象表示当前窗口所在的屏幕,提供显示设备的信息。window.screen
属性指向这个对象。
该对象有下面的属性。
Screen.height
:浏览器窗口所在的屏幕的高度(单位像素)。除非调整显示器的分辨率,否则这个值可以看作常量,不会发生变化。显示器的分辨率与浏览器设置无关,缩放网页并不会改变分辨率Screen.width
:浏览器窗口所在的屏幕的宽度(单位像素)Screen.availHeight
:浏览器窗口可用的屏幕高度(单位像素)。因为部分空间可能不可用,比如系统的任务栏或者 Mac 系统屏幕底部的 Dock 区,这个属性等于height
减去那些被系统组件的高度Screen.availWidth
:浏览器窗口可用的屏幕宽度(单位像素)Screen.pixelDepth
:整数,表示屏幕的色彩位数,比如24表示屏幕提供24位色彩Screen.colorDepth
:Screen.pixelDepth
的别名。严格地说,colorDepth 表示应用程序的颜色深度,pixelDepth 表示屏幕的颜色深度,绝大多数情况下,它们都是同一件事Screen.orientation
:返回一个对象,表示屏幕的方向。该对象的type
属性是一个字符串,表示屏幕的具体方向,landscape-primary
表示横放,landscape-secondary
表示颠倒的横放,portrait-primary
表示竖放,portrait-secondary
window.screen.orientation
// { angle: 0, type: "landscape-primary", onchange: null }
if (window.screen.width >= 1024 && window.screen.height >= 768) {// 分辨率不低于 1024x768
}
if ((screen.width <= 800) && (screen.height <= 600)) {window.location.replace('small.html');
} else {window.location.replace('wide.html');
}
这篇关于【JavaScript 漫游】【032】Navigator 对象和 Screen对象总结的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!