Learn Dynamic HTML With JS
Lesson 1 - HTML JS Relationship
Lesson 2 - HTML DOM
Lesson 4 - Basic Interaction
Lesson 5 - Manipulating CSS
Lesson 6 - HTTP Requests
Lesson 7 - Form Handling
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.