How do you add a new page in javascript?

I would like to make a button on a page that can call a JS function in the same page. The function will need to create (open) new window which its HTML code was given from the JS function itself. How can I do that?

The purpose of this is to produce a print friendly page out of a specific page.

Please notice: No AJAX can be used.

asked Jan 5, 2010 at 6:36

M. A. KishawyM. A. Kishawy

4,94711 gold badges46 silver badges72 bronze badges

var opened = window.open("");
opened.document.write("MyTitletest");

answered Jan 5, 2010 at 7:52

Fabien MénagerFabien Ménager

140k3 gold badges40 silver badges60 bronze badges

var w = window.open("");
w.document.writeln("")

answered Jan 5, 2010 at 6:39

Roy TangRoy Tang

5,4739 gold badges43 silver badges72 bronze badges

0

function fu() {
  var opened = window.open("");
  opened.document.write("Your HTML here");
}

answered Jan 5, 2010 at 6:40

Emil VikströmEmil Vikström

88.5k15 gold badges134 silver badges170 bronze badges

3

Example 1

Open "www.w3schools.com" in a new browser tab:

window.open("https://www.w3schools.com");

Try it Yourself »

More examples below.


Definition and Usage

The open() method opens a new browser window, or a new tab, depending on your browser settings and the parameter values.


Syntax

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

Parameters

Parameter Description
URL Optional.
The URL of the page to open.
If no URL is specified, a new blank window/tab is opened
name Optional.
The target attribute or the name of the window.
The following values are supported:
Value Description
_blank URL is loaded into a new window, or tab. This is the default
_parent URL is loaded into the parent frame
_self URL replaces the current page
_top URL replaces any framesets that may be loaded
name The name of the window (does not specify the title of the window)
specs Optional.
A comma-separated list of items, no whitespaces.
The following values are supported:
fullscreen=yes|no|1|0 Whether or not to display the browser in full-screen mode. Default is no. A window in full-screen mode must also be in theater mode. IE only
height=pixels The height of the window. Min. value is 100
left=pixels The left position of the window. Negative values not allowed
location=yes|no|1|0 Whether or not to display the address field. Opera only
menubar=yes|no|1|0 Whether or not to display the menu bar
resizable=yes|no|1|0 Whether or not the window is resizable. IE only
scrollbars=yes|no|1|0 Whether or not to display scroll bars. IE, Firefox & Opera only
status=yes|no|1|0 Whether or not to add a status bar
titlebar=yes|no|1|0 Whether or not to display the title bar. Ignored unless the calling application is an HTML Application or a trusted dialog box
toolbar=yes|no|1|0 Whether or not to display the browser toolbar. IE and Firefox only
top=pixels The top position of the window. Negative values not allowed
width=pixels The width of the window. Min. value is 100
replace

Deprecated

Specifies whether the URL creates a new entry or replaces the current entry in the history list. The following values are supported:
  • true - URL replaces the current document in the history list
  • false - URL creates a new entry in the history list

Warning

Chrome throws an exception when using this parameter.

Source: Bugs Chromium Issue 1164959.

Return Value

A reference to the new window, or null if the call failed.



More Examples

Open an about:blank page in a new window/tab:

var myWindow = window.open("", "", "width=200,height=100");

Try it Yourself »

Open a new window called "MsgWindow", and write some text into it:

var myWindow = window.open("", "MsgWindow", "width=200,height=100");
myWindow.document.write("

This is 'MsgWindow'. I am 200px wide and 100px tall!

");

Try it Yourself »

Replace the current window with a new window:

var myWindow = window.open("", "_self");
myWindow.document.write("

I replaced the current window.

");

Try it Yourself »

Open a new window and control its appearance:

window.open("https://www.w3schools.com", "_blank", "toolbar=yes,scrollbars=yes,resizable=yes,top=500,left=500,width=400,height=400");

Try it Yourself »

Open a new window. Use close() to close the new window:

function openWin() {
  myWindow = window.open("", "myWindow", "width=200,height=100");   // Opens a new window
}

function closeWin() {
  myWindow.close();   // Closes the new window
}

Try it Yourself »

Open a new window. Use the name property to return the name of the new window:

var myWindow = window.open("", "MsgWindow", "width=200,height=100");
myWindow.document.write("

This window's name is: " + myWindow.name + "

");

Try it Yourself »

Using the opener property to return a reference to the window that created the new window:

var myWindow = window.open("", "myWindow", "width=200,height=100");   // Opens a new window
myWindow.document.write("

This is 'myWindow'

");   // Text in the new window
myWindow.opener.document.write("

This is the source window!

");  // Text in the window that created the new window

Try it Yourself »


Browser Support

open() is supported in all browsers:

Chrome IE Edge Firefox Safari Opera
Yes Yes Yes Yes Yes Yes

How do I open another page in JavaScript?

To open a new tab, we have to use _blank in the second parameter of the window. open() method. The return value of window. open() is a reference to the newly created window or tab or null if it failed.

How do you add a new page in HTML?

Follow the steps below to create your first web page with Notepad or TextEdit..
Step 1: Open Notepad (PC) Windows 8 or later: ... .
Step 1: Open TextEdit (Mac) Open Finder > Applications > TextEdit. ... .
Step 2: Write Some HTML. ... .
Step 3: Save the HTML Page. ... .
Step 4: View the HTML Page in Your Browser..
use action="/feed. html" attribute in the form. or 2. use event.