I would not recomend you to use document.write as others suggest, because if you will open such window twice your HTML will be duplicated 2 times (or more).
Use innerHTML instead
var win = window.open("", "Title", "toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=yes,resizable=yes,width=780,height=200,top="+(screen.height-400)+",left="+(screen.width-840));
win.document.body.innerHTML = "HTML";
Answer from artnikpro on Stack OverflowI would not recomend you to use document.write as others suggest, because if you will open such window twice your HTML will be duplicated 2 times (or more).
Use innerHTML instead
var win = window.open("", "Title", "toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbars=yes,resizable=yes,width=780,height=200,top="+(screen.height-400)+",left="+(screen.width-840));
win.document.body.innerHTML = "HTML";
You can use window.open to open a new window/tab (according to browser setting) in JavaScript.
By using document.write you can write HTML content to the opened window.
Here's an example to open a new window with content using jQuery
<script>
function nWin() {
var w = window.open();
var html = $("#toNewWindow").html();
$(w.document.body).html(html);
}
$(function() {
$("a#print").click(nWin);
});
</script>
<div id="toNewWindow">
<p>Your content here</p>
</div>
<a href="javascript:;" id="print">Open</a>
EDIT: For those who say that this code doesn't work, here's a jsfiddle to try it http://jsfiddle.net/8dXvt/
Try this:
var x=window.open();
x.document.open();
x.document.write('content');
x.document.close();
I find it works in Chrome and IE.
When You want to open new tab/window (depends on Your browser configuration defaults):
output = 'Hello, World!';
window.open().document.write(output);
When output is an Object and You want get JSON, for example (also can generate any type of document, even image encoded in Base64)
output = ({a:1,b:'2'});
window.open('data:application/json;' + (window.btoa?'base64,'+btoa(JSON.stringify(output)):JSON.stringify(output)));
Update
Google Chrome (60.0.3112.90) block this code:
Not allowed to navigate top frame to data URL: data:application/json;base64,eyJhIjoxLCJiIjoiMiJ9
When You want to append some data to existing page
output = '<h1>Hello, World!</h1>';
window.open('output.html').document.body.innerHTML += output;
output = 'Hello, World!';
window.open('about:blank').document.body.innerText += output;
in parent.html:
<script type="text/javascript">
$(document).ready(function () {
var output = "data";
var OpenWindow = window.open("child.html", "mywin", '');
OpenWindow.dataFromParent = output; // dataFromParent is a variable in child.html
OpenWindow.init();
});
</script>
in child.html:
<script type="text/javascript">
var dataFromParent;
function init() {
document.write(dataFromParent);
}
</script>
Try:
var html = popup.document.documentElement.outerHTML
EDIT
The window is not loaded immediately. Something like this will work, assuming that you're not attempting to violate the same-origin policy:
$('#btn').click(function() {
var popup = window.open('[Your URL HERE]', '_blank', 'width=500,height=500');
popup.onload = function() {
setTimeout(function(){ console.log(popup.document.documentElement.outerHTML) }, 2000);
}
});
Here's a working fiddle.
Note: If you control both the parent and the child source, you could also have the child invoke a method on the parent that passes in it's html:
Child Window
// Call when body is loaded
function SendHtmlToParent() {
window.opener.HtmlReceiver(document.outerHTML);
}
Parent
function HtmlReceiver(html) {
console.log(html);
}
Wait...
Note that remote URLs won't load immediately. When window.open() returns, the window always contains about:blank. The actual fetching of the URL is deferred and starts after the current script block finishes executing. The window creation and the loading of the referenced resource are done asynchronously.
MDN
And if you wait, you will get this error:
Unsafe JavaScript attempt to access frame with URL https://www.google.co.il/ from frame with URL http://fiddle.jshell.net/_display/. Domains, protocols and ports must match.
So it can be done with google, unless you're working there...
Fiddle
If you open something "valid" it will work fine.
Working DEMO
Yes it's possible...
var wnd = window.open("about:blank", "", "_blank");
wnd.document.write(html);
That should do the trick.
HTML
Archer's answer is a good one, but you can do this in a one liner if you wish:
window.open("data:text/html;charset=utf-8,"+html, "", "_blank")
Opening XML?
window.open("data:text/xml;charset=utf-8,"+xml, "", "_blank")
With XML, make sure you string begins with <?xml version="1.0" encoding="UTF-8"?> and has a root element. If it doesn't, you can easily add it:
window.open('data:text/xml;charset=utf-8,<?xml version="1.0" encoding="UTF-8"?><RootTag>'+xml+'</RootTag>', "", "_blank")
You can include your content in documet.write() function
<script>
function myFunction() {
var myWindow = window.open("", "","width=600,height=100");
myWindow.document.write("<label>Entar Name:</label><label>Michael</label><br/><br/><label>Entar Age:</label><label>25</label>");
}
</script>
It's very simple... Add after
.open()
the following code
.document.write("Lorem Ipsum");
Here is a jsfiddle
This worked for me fine:
File 1:
<html>
<head></head>
<body>
<a href="#" onclick="window.open('file:///D:/Examples/file2.html'); return false">CLICK ME</a>
</body>
<footer></footer>
</html>
File 2:
<html>
...
</html>
This method works regardless of whether or not the 2 files are in the same directory, BUT both files must be local.
For obvious security reasons, if File 1 is located on a remote server you absolutely cannot open a file on some client's host computer and trying to do so will open a blank target.
window.location.href = 'file://///fileserver/upload/Old_Upload/05_06_2019/THRESHOLD/BBH/Look/chrs/Delia';
Nothing Worked for me.