Get Current URL at Client Side Using JavaScript and jQuery

Sometimes it is necessary to know current URL, so that we will perform different operations on that or use that URL for various purposes. In this post, you will learn to get current URL from browser at client side using JavaScript and jQuery.

Using JavaScript

The window.location read-only property returns a Location object with information about the current location of the document.

Now, you will see all the properties for getting current URL or information about URL. Suppose, URL is as follows:

http://www.shivajisoft.com:8082/index.html#home?articleid=77777

1) window.location.host
=> www.shivajisoft.com:8082
2) window.location.hostname
=> www. shivajisoft.com
3) window.location.port
=> 8082
4) window.location.protocol
=> http
5) window.location.pathname
=> index.html
6) window.location.href
=> http://www.shivajisoft.com:8082/index.html#home
7) window.location.hash
=> #home
8) window.location.search
=> ?articleid=77777

Using jQuery

Suppose, URL is as follows:

http://www.shivajisoft.com:8082/index.html#home?articleid=77777

1) $(location).attr('host');
=> www.shivajisoft.com:8082
2) $(location).attr('hostname');
=> www. shivajisoft.com
3) $(location).attr('port');
=> 8082
4) $(location).attr('protocol');
=> http
5) $(location).attr('pathname');
=> index.html
6) $(location).attr('href');
=> http://www.shivajisoft.com:8082/index.html#home
7) $(location).attr('hash');
=> #home
8) $(location).attr('search');
=> ?articleid=77777

Conclusion :

I hope that this article would have helped you in understanding to Get Current URL at Client Side Using JavaScript and jQuery. Your feedback and constructive contributions are always welcome.