Getting to Learn Window Objects in JavaScript – Opening New Window with open() method

Guest Posts Paolo Nikko Nuñal

There are some instances that you want to create a new window. This is one of the most common thing that many bank websites usually do when users want to transact items. They create a new window in which the login screen is being created there rather than using the same window. This is a great way to prevent malicious code or attempted hacks.

You can do this by using the open() method.

Syntax:

window.open([URL],[NAME],[SPECS],[REPLACE]);

URL - (OPTIONAL) Specifies the URL you want to open. If left blank, a blank page is opened instead.

NAME - (OPTIONAL) Specifies the target attribute of the name and window that is supported. These include _blank, _parent, _self, _top.

SPECS - (OPTIONAL) Comma separated items.

REPLACE - (OPTIONAL) Specifies whether the URL creates a new entry or not.

Code:

<html>
   <body>
      <button onclick="openWindow()">Create Blank Window</button>
      <script>
           var openWindow = function(){
               window.open("","","width=400,height=400");
      </script>
   </body>
</html>


Another example would be opening another website. You can use this to open their browser to a new tab. Just place the name with a string parameter.

Code:

<html>
   <body>
      <button onclick="openWindow()">Open Site</button>
      <script>
           var openWindow = function(){
               window.open(http://localhost:4000);
      </script>
   </body>
</html>


That's how you open another window. You can use this if you don't want users to move from another page or get redirected.