How to get the current url with javascript

5个答案

To retrieve the current page's URL in JavaScript, you can use the window.location object, which contains information related to the current window's location. Below are some properties and methods to retrieve the current URL:

window.location.href : Returns the full URL string (including protocol, host, port (if present), path, query string, and fragment).

For example, if the current URL is "https://www.example.com:80/path/index.html?search=test#section1", you can retrieve the full URL as follows:

javascript
var currentUrl = window.location.href;
console.log(currentUrl); // Outputs: "https://www.example.com:80/path/index.html?search=test#section1"

window.location.hostname : Returns the web server's domain.

For example:

javascript
var hostname = window.location.hostname;
console.log(hostname); // Outputs: "www.example.com"

window.location.pathname : Returns the path part of the URL.

For example:

javascript
var pathname = window.location.pathname;
console.log(pathname); // Outputs: "/path/index.html"

window.location.protocol : Returns the protocol used by the page, typically "http:" or "https:".

For example:

javascript
var protocol = window.location.protocol;
console.log(protocol); // Outputs: "https:"

window.location.port : Returns the server port number.

For example:

javascript
var port = window.location.port;
console.log(port); // Outputs: "80"

window.location.search : Returns the query string part of the URL, starting with "?".

For example:

javascript
var search = window.location.search;
console.log(search); // Outputs: "?search=test"

window.location.hash : Returns the fragment part of the URL, starting with "#".

For example:

javascript
var hash = window.location.hash;
console.log(hash); // Outputs: "#section1"

window.location.assign(url) : Loads a new document.
window.location.reload() : Reloads the current page.
window.location.replace(url) : Replaces the current page with a new one.

Using these properties and methods, you can retrieve and manipulate the current page's URL as needed. For example, if you need to perform certain actions based on the URL's query string parameters, you can extract window.location.search and parse these parameters.

2024年6月29日 12:07 回复

Using pure JavaScript, you can easily retrieve the full URL of the current page. For example, try the following code on this page:

javascript
window.location.href;
// When used in the console of this page, it will return
// [http://stackoverflow.com/questions/1034621/get-current-url-in-web-browser](http://stackoverflow.com/questions/1034621/get-current-url-in-web-browser)

The window.location.href property returns the URL of the current page.

document.getElementById("root").innerHTML = "The full URL of this page is: " + window.location.href;

2024年6月29日 12:07 回复

Get the current page's URL: window.location.href

2024年6月29日 12:07 回复

URL Information Access

JavaScript provides various methods to retrieve and modify the current URL displayed in the browser's address bar. All these methods utilize the Location object, which is a property of the Window object. You can read the current Location object using the following method:

javascript
var currentLocation = window.location;

Basic URL Structure

<protocol>//<hostname>:<port>/<pathname><search><hash>

Protocol: Specifies the protocol name used to access resources on the Internet. (HTTP without SSL or HTTPS with SSL)
hostname: The hostname specifies the host that owns the resource. For example, www.stackoverflow.com. Servers use the hostname to provide services.
Port: The port number identifies the specific process to which Internet or other network messages are forwarded when reaching the server.
pathname: The pathname provides information about the specific resource within the host that the web client wants to access. For example, /index.html.
search: The query string follows the path component and provides a string of information that the resource can use for a specific purpose (e.g., as search parameters or as data to process).
hash: The hash part of the URL, including the hash symbol (#).

Through these Location object properties, you can access all these URL components and the content they can set or return:

href - The entire URL
protocol - The URL's protocol
host - The URL's hostname and port
hostname - The URL's hostname
port - The port number used by the server for the URL
pathname - The URL's pathname
search - The URL's query part
hash - The URL's hash part
origin — window.location.protocol + '//' + window.location.host

2024年6月29日 12:07 回复

Use:

javascript
window.location.href

As noted in the comments, the following line works but has issues in Firefox.

javascript
document.URL

See URL of type DOMString, readonly.

2024年6月29日 12:07 回复

How to get the current url with javascript

5个答案

你的答案