Checking connection...

JavaScript Navigator Object

Complete guide to browser detection, cookies, language, connectivity, and platform information

1. Basic Navigator Properties

πŸ‘€
User Agent
navigator.userAgent
Loading...
Contains browser and OS information. Used for browser detection but can be spoofed. Modern approach: Use feature detection instead.
🏷️
Application Name
navigator.appName
Loading...
Legacy property that usually returns "Netscape" for compatibility. Not reliable for modern browsers.
πŸ”€
Application Code Name
navigator.appCodeName
Loading...
Usually returns "Mozilla" for all browsers. Historical property from Netscape Navigator days.
πŸ’»
Platform
navigator.platform
Loading...
Operating system platform. Values like "Win32", "MacIntel", "Linux x86_64", "iPhone", "Android".
βš™οΈ
Product
navigator.product
Loading...
Usually returns "Gecko" for Firefox and "WebKit" for Chrome/Safari. Rendering engine name.
πŸ”’
Version
navigator.appVersion
Loading...
Browser version information. Contains version number and platform details. Part of userAgent string.
🌐

2. Browser Detection & Information

Detected Browser
Detecting...
Browser Version
Detecting...
Operating System
Detecting...
Device Type
Detecting...
// Modern Browser Detection
function detectBrowser() {
  const ua = navigator.userAgent;
  let browser = "Unknown";
  let version = "Unknown";

  // Chrome
  if (ua.indexOf("Chrome") > -1 && !ua.indexOf("Edg") > -1) {
    browser = "Chrome";
    version = ua.match(/Chrome\/(\d+\.\d+)/)?.[1];
  }
  // Firefox
  else if (ua.indexOf("Firefox") > -1) {
    browser = "Firefox";
    version = ua.match(/Firefox\/(\d+\.\d+)/)?.[1];
  }
  // Safari
  else if (ua.indexOf("Safari") > -1 && !ua.indexOf("Chrome") > -1) {
    browser = "Safari";
    version = ua.match(/Version\/(\d+\.\d+)/)?.[1];
  }
  // Edge
  else if (ua.indexOf("Edg") > -1) {
    browser = "Edge";
    version = ua.match(/Edg\/(\d+\.\d+)/)?.[1];
  }

  return { browser, version };
}

3. Browser Cookies Management

// Cookie Management Functions

// Create cookie
function setCookie(name, value, days) {
  let expires = "";
  if (days) {
    const date = new Date();
    date.setTime(date.getTime() + (days * 24 * 60 * 60 * 1000));
    expires = "; expires=" + date.toUTCString();
  }
  document.cookie = name + "=" + value + expires + "; path=/";
}

// Read cookie
function getCookie(name) {
  const nameEQ = name + "=";
  const ca = document.cookie.split(';');
  for(let i=0; i < ca.length; i++) {
    let c = ca[i];
    while (c.charAt(0) == ' ') c = c.substring(1);
    if (c.indexOf(nameEQ) == 0) return c.substring(nameEQ.length);
  }
  return null;
}

4. Browser Language Detection

Browser Language
Detecting...
User Language
Detecting...
Languages Array
Detecting...
Preferred Language
Detecting...

Select Your Preferred Language:

πŸ‡ΊπŸ‡Έ English
πŸ‡ͺπŸ‡Έ EspaΓ±ol
πŸ‡«πŸ‡· FranΓ§ais
πŸ‡©πŸ‡ͺ Deutsch
πŸ‡―πŸ‡΅ ζ—₯本θͺž
πŸ‡¨πŸ‡³ δΈ­ζ–‡
// Language Detection and Internationalization

// Get browser language
const language = navigator.language || navigator.userLanguage;
console.log('Browser language:', language); // "en-US"

// Get all preferred languages
const languages = navigator.languages;
console.log('Preferred languages:', languages); // ["en-US", "en", "es"]

// Internationalization example
const date = new Date();
const formattedDate = new Intl.DateTimeFormat(language).format(date);
const formattedNumber = new Intl.NumberFormat(language).format(1234567.89);

// Currency formatting
const price = 99.99;
const formattedPrice = new Intl.NumberFormat(language, {
  style: 'currency',
  currency: 'USD'
}).format(price);

5. Online/Offline Status & Connectivity

πŸ“Ά
Online Status
navigator.onLine
Checking...
Returns true if browser is online, false if offline. Note: True doesn't guarantee internet access, only that browser is in "online mode".
🌐
Connection Info
navigator.connection
Loading...
Provides network information like type (wifi, cellular), effective type (4g, 3g), downlink speed, and round-trip time.
β˜•
Java Enabled
navigator.javaEnabled()
Checking...
Returns true if Java is enabled in the browser. Note: Java (different from JavaScript) is rarely used in modern web development.
πŸͺ
Cookie Enabled
navigator.cookieEnabled
Checking...
Returns true if cookies are enabled in the browser. Essential for session management and user preferences.

6. Platform & Hardware Information

πŸ’» πŸ“± ⚑ πŸ’Ύ
Device Memory
Checking...
Hardware Concurrency
Checking...
Max Touch Points
Checking...
Vendor
Checking...
// Hardware and Platform Detection

// Check device capabilities
if ('deviceMemory' in navigator) {
  console.log('Device memory:', navigator.deviceMemory + 'GB');
}

if ('hardwareConcurrency' in navigator) {
  console.log('CPU cores:', navigator.hardwareConcurrency);
}

// Touch support
if ('maxTouchPoints' in navigator) {
  console.log('Max touch points:', navigator.maxTouchPoints);
}

// Vendor information
console.log('Browser vendor:', navigator.vendor);

// Platform architecture
if ('userAgentData' in navigator) {
  navigator.userAgentData.getHighEntropyValues(['architecture'])
    .then(ua => console.log('Architecture:', ua.architecture));
}