Open In App
Related Articles

JavaScript | window.location and document.location Objects

Improve Article
Save Article
Like Article

window.location and document.location: These objects are used for getting the URL (the current or present page address) and avert browser to a new page or window. The main difference between both is their compatibility with the browsers.

  • The window.location is read/write on all compliant browsers.
  • The document.location is read-only in Internet Explorer but read/write in Firefox, SeaMonkey that are Gecko-based browsers.

All modern browsers map document.location to the window.location but you can prefer window.location for cross-browser safety.


  • window.location.href: It returns the URL of the current working page.
  • window.location.hostname: It returns the domain name of web host.
  • window.location.pathname: It returns the path and filename of the current working page.
  • window.location.protocol: It returns the used protocol (http: or https:).
  • window.location.port(): It prints the port number.
  • It prints host name along with port number.
  • window.location.assign(): It loads new document.

Example 1: This example using different properties to get different parts of URL.

<!DOCTYPE html>
<html lang="en">
    <title>Get Different Part of a URL</title>
        // Prints complete URL
        document.write("URL IS:  " 
                + window.location.href + "<br>");
        // Prints hostname like local host (
        document.write("HOSTNAME:  " 
                + window.location.hostname + "<br>");
        // Prints pathname like /products/find.php
        document.write("PATHNAME:  " 
                + window.location.pathname + "<br>");
        // Prints the protocol used like http: or https:
        document.write("PROTOCOL:  " 
                + window.location.protocol + "<br>");
        // Prints hostname with port like localhost:3000
        document.write("HOSTNAME WITH PORT:  " 
                + + "<br>");
        // Prints port number like 3000
        document.write("PORTNUMBER:  " 
                + window.location.port + "<br>");


PATHNAME: /tryit.php
PROTOCOL: https:

Note: When you visit a specific website, it is always connected to a port. However, most browsers will not display the default port number.

Example 2: Assign or load new document.

<!DOCTYPE html>
<html lang="en">
        Load another Resource or 
        document from a URL
        function loadPage() {
    <button type="button" onclick="loadPage();">
        Load Page


  • Before Clicking the Button:
  • After Clicking the Button:

Whether you're preparing for your first job interview or aiming to upskill in this ever-evolving tech landscape, GeeksforGeeks Courses are your key to success. We provide top-quality content at affordable prices, all geared towards accelerating your growth in a time-bound manner. Join the millions we've already empowered, and we're here to do the same for you. Don't miss out - check it out now!

Last Updated : 13 May, 2020
Like Article
Save Article
Similar Reads
Complete Tutorials