How to parse a URL into hostname and path in javascript ? Last Updated : 16 Jan, 2023 Comments Improve Suggest changes Like Article Like Report We can parse a URL(Uniform Resource Locator) to access its component and this can be achieved using predefined properties in JavaScript. For Example, the first example parses the URL of the current web page and the second example parses a predefined URL. Example 1:This example parses the URL of the current web page. HTML <body style="text-align:center;"> <h2 style="color:green;"> Required URL is: </h2> <p id="para1"></p> <button onclick="my_function()"> Parse It </button> <p id="para2"></p> <p id="para3"></p> <!--Script to parse the URL of the current web page--> <script> document.getElementById("para1") .innerHTML = window.location.href; function my_function() { document.getElementById("para2") .innerHTML = `<h3 style="color:green;">Hostname : </h3>` + window.location.hostname; document.getElementById("para3") .innerHTML = `<h3 style="color:green;">Path : </h3>` + window.location.pathname; } </script> </body> Output: Parse a URL into hostname and path Example 2 This example parses the predefined URL. HTML <body style="text-align: center;"> <h2 style="color: green;"> Required URL is: </h2> <p id="para1"></p> <button onclick="my_function()"> Parse It </button> <p id="para2"></p> <p id="para3"></p> <!--Script to parse predefined URL --> <script> var my_url = new URL( "https://write.geeksforgeeks.org/post/"); document.getElementById("para1") .innerHTML = my_url; function my_function() { document.getElementById("para2") .innerHTML = `<h3 style="color:green;">Hostname : </h3>` + my_url.hostname; document.getElementById("para3") .innerHTML = `<h3 style="color:green;">Path : </h3>` + my_url.pathname; } </script> </body> Output: Parse a URL into hostname and path Comment More infoAdvertise with us Next Article How to parse a URL into hostname and path in javascript ? T tanyagarg3434 Follow Improve Article Tags : Technical Scripter JavaScript Web Technologies Technical Scripter 2020 JavaScript-Questions +1 More Similar Reads How To Get URL And URL Parts In JavaScript? In web development, working with URLs is a common task. Whether we need to extract parts of a URL or manipulate the URL for navigation, JavaScript provides multiple approaches to access and modify URL parts. we will explore different approaches to retrieve the full URL and its various components.The 3 min read How to Encode and Decode a URL in JavaScript? Encoding and decoding URLs in JavaScript is essential for web development, especially when making GET requests with query parameters. This process ensures special characters in URLs are correctly interpreted by the server. For instance, spaces are converted to %20 or + in URLs. This guide covers how 4 min read How to Get Domain Name From URL in JavaScript? In JavaScript, the URL object allows you to easily parse URLs and access their components. This is useful when you need to extract specific parts of a URL, such as the domain name. The hostname property of the URL object provides the domain name of the URL.PrerequisiteJavascriptHTMLBelow are the fol 2 min read How to Extract the Host Name from URL using JavaScript? Extracting the hostname from a URL using JavaScript means retrieving the domain part from a complete web address. This can be done using JavaScript's URL object or methods like window.location, which allow easy access to the hostname of a URL.What is URL?A URL (Uniform Resource Locator) is the web a 2 min read How to Get Browser to Navigate URL in JavaScript? As a web developer, you may need to navigate to a specific URL from your JavaScript code. This can be done by accessing the browser's window object and using one of the available methods for changing the current URL.In JavaScript, there are several approaches for navigating to a URL. The most common 4 min read How to redirect to a relative URL in JavaScript? To redirect to a relative URL in JavaScript, you could use window.location.href. It is a property in JavaScript that represents the complete URL of the current page. It can be used to get the current URL or to navigate to a new URL by assigning a new URL to it. Approach HTML Structure:The HTML file 2 min read How to get protocol, domain and port from URL using JavaScript ? The protocol, domain, and port of the current page can be found by two methods: Method 1: Using location.protocol, location.hostname, location.port methods: The location interface has various methods that can be used to return the required properties. The location.protocol property is used to return 2 min read How to get the file name from page URL using JavaScript ? JavaScript provides multiple techniques for string manipulation and pattern matching. By demonstrating various methods, the article equips developers with versatile solutions to dynamically retrieve and utilize file names from different URL formats within their applications. There are several approa 3 min read How to parse URL using JavaScript ? Given an URL and the task is to parse that URL and retrieve all the related data using JavaScript. Example: URL: https://www.geeksforgeeks.org/courses When we parse the above URL then we can find hostname: geeksforgeeks.com path: /courses Method 1: In this method, we will use createElement() method 2 min read How to Create Query Parameters in JavaScript ? Creating query parameters in JavaScript involves appending key-value pairs to a URL after the `?` character. This process is essential for passing data to web servers via URLs, enabling dynamic and interactive web applications through GET requests and URL manipulation. Example: Input: {'website':'ge 3 min read Like