JavaScript Window.Open New Tab
Last Updated : Mar 11, 2024
IN - JavaScript | Written & Updated By - Pragati
In this tutorial we will show you the solution of JavaScript window.open new tab, the window.open() method generally used for open any website or document dynamically.
We defined button with ‘onclick’ event so when user clicks on that button it will opens which website link we defined on window.open() method.
For opening that url contain website on new tab we need to use predefined value ‘_blank’ as second parameter of window.open() method.
Step By Step Guide On JavaScript Window.Open New Tab :-
Here we defined one button ‘Open New Window’ with ‘onclick’ event it is used for load some kind of scripts.
When user clicks on that button it loads ‘open()’ function within that we defined window.open() method with two parameters.
First parameter refers ‘url’ contains location of particular sites and second is optional we used that for open our defined site on new tab by value ‘_blank’.
So when user clicks it opens ‘linkedin’ site on new tab.
<!DOCTYPE html>
<html>
<head>
<title>Window Open</title>
</head>
<body>
<button onclick="open()">Open New Window</button>
<script>
function open(){
window.open("https://www.linkedin.com","_blank");
}
</script>
</body>
</html>
- <!DOCTYPE html> tag which is instruct the web browser about what version of HTML file written in and it’s not have any ending tag.
- The<html> tag is used to indicate the beginning of HTML document.
- As above shown <head> tag is contains information about webpage and external file links are declared here. <title> tag is used for set the webpage title.
- Both <head> and <title> tags having their pair end tag, so we need to close the ending tags respectively. If you’re not closed anyone of ending tag properly that is also affect the webpage result.
- <body> tag is beginning of main coding part because it contain coding of entire website blocks and elements described here.
- We defined button ‘Open New Window’ with ‘onclick’ event. This event will work when user clicks on that button, within event we declared open() function call.
- Within <script> tag we defined open() function, here we defined window.open() method with two parameters ‘https://www.linkedin.com,_blank’ so linked in site will open on new tab.
- When using open source sites we don’t forget to use internet connection and if we using local html file means we don’t need internet connection also but we need accurate path informations.
- Both </body>,</html> tags closed respectively. </body> tag indicates the end of body, Then </html> tag indicates the end of HTML document.
Conclusion :-
In conclusion we are able to know how to use window.open() with new tab in javascript.
When we execute our program on browser we can see one button ‘Open New Window’ when user clicks on that button it loads linked site on new tab for this successful execution we need internet connection because we provide open source site link.
We can this concept with any site url but the location url must need to be correct otherwise result site will not open. We will see about them in future.
I hope this tutorial on JavaScript window.open new tab helps you and the steps and method mentioned above are easy to follow and implement.
About Pragati
