Get Current Page URL, Path, Host and hash using jQuery
jQuery get current Page URL, Path, and hash; Through this tutorial, i am going to show you how to get the current page URL, path name, host name, origin, hash using the jQuery.
How to get current Page URL, Path, and hash using jQuery?
- Use the syntaxÂ
$(location).attr("href");Â For find the current page full URL - Use the syntaxÂ
$(location).attr("origin");Â For get the base URL - Use the syntaxÂ
$(location).attr("pathname");Â for find the pathname of the current URL - Use the syntaxÂ
$(location).attr("pathname");Â for find the pathname of the current URL
Use the syntax $(location).attr("href"); For find the current page full URL
The following example will show you how to find the current page URL using jQuery.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Get Current Page URL Using jQuery</title>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".getUrl").click(function(){
var pURL = $(location).attr("href");
alert(pURL);
});
});
</script>
</head>
<body>
<button type="button" class="getUrl">Get URL</button>
</body>
</html>
Use the syntax $(location).attr("origin"); For get the base URL
The following example will show you how to find the current base URL using jQuery.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Get Current Page URL Using jQuery</title>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".getUrl").click(function(){
var originURL = $(location).attr("origin");
alert(originURL);
});
});
</script>
</head>
<body>
<button type="button" class="getUrl">Get URL</button>
</body>
</html>
Use the syntax $(location).attr("pathname"); for find the pathname of the current URL.
The following example will show you how to find the pathname from the current page the URL using jQuery.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Get Pathname From Current Page URL Using jQuery</title>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".getUrl").click(function(){
var pathname = $(location).attr("pathname");
alert(pathname);
});
});
</script>
</head>
<body>
<button type="button" class="getUrl">Get URL</button>
</body>
</html>
Use the syntax $(location).attr("host"); for find the host of the current URL.
The following example will show you how to find the hostname from the current page the URL using jQuery.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Get Hostname From Current Page URL Using jQuery</title>
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".getUrl").click(function(){
var host = $(location).attr("host");
alert(host);
});
});
</script>
</head>
<body>
<button type="button" class="getUrl">Get URL</button>
</body>
</html>
Conclusion
jQuery get current Page URL, Path, and hash; Through this tutorial, you have learned how to get the current page URL, path name, host name, origin, hash using the jQuery.
