Master AI & Build your First Coding Portfolio with SkillReactor | Sign Up Now

Lesson 3 - Browser BOM

3.3 JS Location

The location object contains data about the current URL and provides methods to manipulate it. It is useful for tasks like redirecting the user or obtaining details about the current URL.

Here are some commonly used properties and methods of the location object:

  • location.href: Provides the entire URL of the current page.
const url = location.href;
console.log(`URL: ${url}`);
  • location.hostname: Provides the domain name of the web host.
const hostname = location.hostname;
console.log(`Hostname: ${hostname}`);
  • location.pathname: Provides the path of the current page.
const pathname = location.pathname;
console.log(`Pathname: ${pathname}`);
  • location.search: Provides the query string (including the ?).
const queryString = location.search;
console.log(`Query String: ${queryString}`);
  • location.hash: Gets the anchor part of the URL (including the #).
const hash = location.hash;
console.log(`Hash: ${hash}`);
  • location.reload(): Reloads the current page.
location.reload();

These examples demonstrate how to use various properties and methods of the location object in JavaScript to interact with and manipulate the current URL, enabling tasks such as navigation, querying parameters, and reloading the page.