Javascript Window Object: How to open and close a new browser window using javascript?

Javascript Window Object: How to open and close a new browser window using javascript?

Every web browser window and every frame within every window is represented by a Window object in Javascript.

Why to use Javascript Window Object?

Sometimes you need to open a new window in your application for some purpose. Here Javascript Window Object comes into play. Using Javascript window object you can open a new window in your HTML page.

Syntax and Explanation of Javascript Window Object

window.open('url', 'name of window', 'attribute1, attribute2')

1. url: This is the web address of the page you wish to appear in the new window.

2. name of window: You can name your new javascript window whatever you like.

3. 'attribute1, attribute2': You can set attributes or properties of the new window like below:

Javascript Window Object Attributes and Properties

Below is a list of the attributes you can use:

1. width=300: Use this to define the width of the new window.

2. height=200: Use this to define the height of the new window.

3. resizable=yes or no: Use this to control whether or not you want the user to be able to resize the window.

4. scrollbars=yes or no: This lets you decide whether or not to have scrollbars on the window.

5. toolbar=yes or no: Whether or not the new window should have the browser navigation bar at the top (The back, foward, stop buttons..etc.).

6. location=yes or no: Whether or not you wish to show the location box with the current url.

7. directories=yes or no: Whether or not the window should show the extra buttons. (what's cool, personal buttons, etc...).

8. status=yes or no: Whether or not to show the window status bar at the bottom of the window.

9. menubar=yes or no: Whether or not to show the menus at the top of the window (File, Edit, etc...).

10. copyhistory=yes or no: Whether or not to copy the old browser window's history list to the new window.

Example: How to open a new browser window using javascript window object?

<form>
<input type="button"

value="Open a new window"
onClick="window.open('http://theprofessionalspoint.blogspot.com/','TheProfessionalsPoint','width=400,height=200,toolbar=yes,
location=yes,directories=yes,status=yes,menubar=yes,scrollbars=yes,copyhistory=yes,
resizable=yes')">
</form>

Example: How to close a new browser window using javascript window object?

<form>
<input type="button" value="Close Window" onClick="window.close()">
</form>