window.navigator屬性指向一個包含瀏覽器和系統(tǒng)信息的Navigator對象。腳本通過這個屬性了解用戶的環(huán)境信息。
Navigator 對象的屬性
Navigator.userAgent
navigator.userAgent屬性返回瀏覽器的User Agent字符串，表示瀏覽器的廠商和版本信息。
下面是 Chrome 瀏覽器的userAgent。
navigator.userAgent
// "Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/29.0.1547.57 Safari/537.36"
通過userAgent屬性識別瀏覽器，不是一個好辦法。因為必須考慮所有的情況（不同的瀏覽器，不同的版本），非常麻煩，而且用戶可以改變這個字符串。這個字符串的格式并無統(tǒng)一規(guī)定，也無法保證未來的適用性，各種上網(wǎng)設(shè)備層出不窮，難以窮盡。所以，現(xiàn)在一般不再通過它識別瀏覽器了，而是使用“功能識別”方法，即逐一測試當(dāng)前瀏覽器是否支持要用到的 JavaScript 功能。
不過，通過userAgent可以大致準(zhǔn)確地識別手機瀏覽器，方法就是測試是否包含mobi字符串。
var ua = navigator.userAgent.toLowerCase();
if (/mobi/i.test(ua)) {
// 手機瀏覽器
} else {
// 非手機瀏覽器
}
如果想要識別所有移動設(shè)備的瀏覽器，可以測試更多的特征字符串。
/mobi|android|touch|mini/i.test(ua)
Navigator.plugins
Navigator.plugins屬性返回一個類似數(shù)組的對象，成員是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
Navigator.platform屬性返回用戶的操作系統(tǒng)信息，比如MacIntel、Win32、Linux x86_64等 。
navigator.platform // "Linux x86_64"
Navigator.onLine
navigator.onLine屬性返回一個布爾值，表示用戶當(dāng)前在線還是離線（瀏覽器斷線）。
navigator.onLine // true
有時，瀏覽器可以連接局域網(wǎng)，但是局域網(wǎng)不能連通外網(wǎng)。這時，有的瀏覽器的onLine屬性會返回true，所以不能假定只要是true，用戶就一定能訪問互聯(lián)網(wǎng)。不過，如果是false，可以斷定用戶一定離線。
用戶變成在線會觸發(fā)online事件，變成離線會觸發(fā)offline事件，可以通過window.ononline和window.onoffline指定這兩個事件的回調(diào)函數(shù)。
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屬性返回一個數(shù)組，表示用戶可以接受的語言。Navigator.language總是這個數(shù)組的第一個成員。HTTP 請求頭信息的Accept-Language字段，就來自這個數(shù)組。
navigator.languages // ["en-US", "en", "zh-CN", "zh", "zh-TW"]
如果這個屬性發(fā)生變化，就會在window對象上觸發(fā)languagechange事件。
Navigator.geolocation
Navigator.geolocation屬性返回一個Geolocation對象，包含用戶地理位置的信息。注意，該 API 只有在 HTTPS 協(xié)議下可用，否則調(diào)用下面方法時會報錯。
Geolocation對象提供下面三個方法。
-
Geolocation.getCurrentPosition()：得到用戶的當(dāng)前位置 -
Geolocation.watchPosition()：監(jiān)聽用戶位置變化 -
Geolocation.clearWatch()：取消watchPosition()方法指定的監(jiān)聽函數(shù)
注意，調(diào)用這三個方法時，瀏覽器會跳出一個對話框，要求用戶給予授權(quán)。
Navigator.cookieEnabled
Navigator.cookieEnabled屬性返回一個布爾值，表示瀏覽器的 Cookie 功能是否打開。
navigator.cookieEnabled // true
注意，這個屬性反映的是瀏覽器總的特性，與是否儲存某個具體的網(wǎng)站的 Cookie 無關(guān)。用戶可以設(shè)置某個網(wǎng)站不得儲存 Cookie，這時cookieEnabled返回的還是true。
Navigator 對象的方法
Navigator.javaEnabled()
Navigator.javaEnabled()方法返回一個布爾值，表示瀏覽器是否能運行 Java Applet 小程序。
navigator.javaEnabled() // false
Navigator.sendBeacon()
Navigator.sendBeacon()方法用于向服務(wù)器異步發(fā)送數(shù)據(jù)。
Screen 對象
Screen 對象表示當(dāng)前窗口所在的屏幕，提供顯示設(shè)備的信息。window.screen屬性指向這個對象。
該對象有下面的屬性。
-
Screen.height：瀏覽器窗口所在的屏幕的高度（單位像素）。除非調(diào)整顯示器的分辨率，否則這個值可以看作常量，不會發(fā)生變化。顯示器的分辨率與瀏覽器設(shè)置無關(guān)，縮放網(wǎng)頁并不會改變分辨率。 -
Screen.width：瀏覽器窗口所在的屏幕的寬度（單位像素）。 -
Screen.availHeight：瀏覽器窗口可用的屏幕高度（單位像素）。因為部分空間可能不可用，比如系統(tǒng)的任務(wù)欄或者 Mac 系統(tǒng)屏幕底部的 Dock 區(qū)，這個屬性等于height減去那些被系統(tǒng)組件的高度。 -
Screen.availWidth：瀏覽器窗口可用的屏幕寬度（單位像素）。 -
Screen.pixelDepth：整數(shù)，表示屏幕的色彩位數(shù)，比如24表示屏幕提供24位色彩。 -
Screen.colorDepth：Screen.pixelDepth的別名。嚴(yán)格地說，colorDepth表示應(yīng)用程序的顏色深度，pixelDepth表示屏幕的顏色深度，絕大多數(shù)情況下，它們都是同一件事。 -
Screen.orientation：返回一個對象，表示屏幕的方向。該對象的type屬性是一個字符串，表示屏幕的具體方向，landscape-primary表示橫放，landscape-secondary表示顛倒的橫放，portrait-primary表示豎放，portrait-secondary。
下面是Screen.orientation的例子。
window.screen.orientation
// { angle: 0, type: "landscape-primary", onchange: null }
下面的例子保證屏幕分辨率大于 1024 x 768。
if (window.screen.width >= 1024 && window.screen.height >= 768) {
// 分辨率不低于 1024x768
}
下面是根據(jù)屏幕的寬度，將用戶導(dǎo)向不同網(wǎng)頁的代碼。
if ((screen.width <= 800) && (screen.height <= 600)) {
window.location.replace('small.html');
} else {
window.location.replace('wide.html');
}
