Skip to content
Related Articles

Related Articles

How to open URL in a new window using JavaScript ?
  • Last Updated : 31 Dec, 2019
GeeksforGeeks - Summer Carnival Banner

In HTML, the anchor tag is used to open new windows and tabs in a very straightforward manner. However, there is a need to do the same using JavaScript. In JavaScript, window.open() proves to be helpful. The window.open() method is used to open a new browser window or a new tab depending on the browser setting and the parameter values.

Syntax:

window.open(URL, name, specs, replace);

Note: All the parameters are optional.

Approach:

  • To open a URL in new window, make sure that the second parameter is not _blank.
  • The other parameters can be varied accordingly as per the need of the new window.

Example 1:






<!DOCTYPE html>
<html>
  
<body style="text-align:center;">
  
    <h1 style="color:green">
        GeeksforGeeks
    </h1>
  
    <p>
        Click the button to
        open a new window.
    </p>
  
    <button onclick="NewTab()">
        Open Geeksforgeeks
    </button>
  
    <script>
        function NewTab() {
            window.open("https://www.geeksforgeeks.org",
                    "", "width=300, height=300");
        }
    </script>
</body>
  
</html>

Output:

  • Before Clicking on Button:
  • After Clicking on Button:

Example 2: Use Anchor tag to open URL in a new window.




<!DOCTYPE html>
<html>
  
<body style="text-align:center;">
      
    <h1 style="color:green">
        GeeksforGeeks
    </h1>
      
    <p>
        Click the button to open
        GeeksforGeeks in a new window.
    </p>
  
    <a onclick=
    'window.open("http://www.geeksforgeeks.org/",
            "_blank", "width=300, height=300");'>
        GeeksforGeeks
    </a>
</body>
  
</html>

Output:

  • Before Clicking on GeeksforGeeks:
  • After Clicking on GeeksforGeeks:

Example 3: Use Input tag to open URL in a new window.




<!DOCTYPE html>
<html>
  
<body style="text-align:center;">
      
    <h1 style="color:green">
        GeeksforGeeks
    </h1>
      
    <p>
        Click the button to open
        GeeksforGeeks in a new window.
    </p>
  
    <input type="button"
        onclick="window.open(
        'http://www.geeksforgeeks.org/','geeks',
        'toolbars=0,width=300,height=300,left=200,
        top=200,scrollbars=1,resizable=1');" 
        value="Open the window">
</body>
  
</html>                    

Output:

  • Before Clicking on Button:
  • After Clicking on Button:

full-stack-img

My Personal Notes arrow_drop_up
Recommended Articles
Page :