Data Structure
Networking
RDBMS
Operating System
Java
MS Excel
iOS
HTML
CSS
Android
Python
C Programming
C++
C#
MongoDB
MySQL
Javascript
PHP
- Selected Reading
- UPSC IAS Exams Notes
- Developer's Best Practices
- Questions and Answers
- Effective Resume Writing
- HR Interview Questions
- Computer Glossary
- Who is Who
Set Location and Location Href Using JavaScript
As we know, the onclick event occurs only when a user clicks the elements and it is a purely JavaScript attribute. Whenever you click on the onclick event it does some actions like displaying a message or redirecting the user to another page. The onclick event must be used very less in the website, because it may create the confusing to the users. So, use these event very wisely.
The window.location object is used to get the current page URL and it redirects the browser completely to a new page. It can be written without the prefix i.e., window-like location.href, and location etc., Some of the types of window location as follow ?
location.href
location.hostname
location.protocol
location.assign()
location.pathname
In this article, we are going to learn how to set the location and location.href using the JavaScript.
Syntax
The following is the syntax for the setting location and location.href after clicking the button using the JavaScript ?
location = URL or location.href = URL
Parameter
URL ? Used to specify the URL
Steps
Follow the below-given steps to set the location and location.href after clicking the button in JavaScript ?
Step 1 ? Under the body section, we defined the heading, button and script elements.
Step 2 ? Let's define the style for the heading element of the HTML Document.
Step 3 ? For the button element, the myLocation() method is defined. Using this method location will be changed when we press the button.
Step 4 ? In myLocation() method, the location URL is mentioned clearly for which method functionality should be performed.
Step 5 ? After clicking the button, the onClick event function is triggers and it changes the URL location.
Example
In this example, we are going to set the location after clicking the button with the help of JavaScript.
<html>
<body>
<h2>Setting the location using the Javascript</h2>
<p>Click the button to go to www.tutorialspoint.com</p>
<button onclick ="myLocation()">
Click Here to go to the URL
</button>
<script>
//function to setting the location using the Javascript
function myLocation() {
location = "https://www.tutorialspoint.com/";
}
</script>
</body>
</html>
Example
Let us see another example by using the location.href to set the location using the JavaScript.
<html>
<body>
<h2>Setting the location using the Javascript<h2>
<button onclick ="hrefLocation()">
Click Here to go to the Tutorials Point
</button>
<script>
//function to setting the location using the Javascript
function hrefLocation() {
location.href = "https://www.tutorix.com/index.htm";
}
</script>
</body>
</html>
Conclusion
In this article, we have demonstrated how to set the location and location.href along with examples. We have seen the two different examples here, we used the location property for setting the location of the URL. In the first and second example, we used the ?location and location.href' properties for setting the designated URLs.
4K+ Views
