This question asks for a way to open a new window using window.open
and then inject it with a script. It was not possible because of cross-domain security issues.
However, my problem is that I want to do the exact same thing, except from the same domain to the same domain. Is this possible?
Note that .write
does not solve this problem because it wipes all the html from the page first.
This question asks for a way to open a new window using window.open
and then inject it with a script. It was not possible because of cross-domain security issues.
However, my problem is that I want to do the exact same thing, except from the same domain to the same domain. Is this possible?
Note that .write
does not solve this problem because it wipes all the html from the page first.
3 Answers
Reset to default 13You can do something like this:
var theWindow = window.open('http://stackoverflow.'),
theDoc = theWindow.document,
theScript = document.createElement('script');
function injectThis() {
// The code you want to inject goes here
alert(document.body.innerHTML);
}
theScript.innerHTML = 'window.onload = ' + injectThis.toString() + ';';
theDoc.body.appendChild(theScript);
This also seems to work:
var theWindow = window.open('http://stackoverflow.'),
theScript = document.createElement('script');
function injectThis() {
// The code you want to inject goes here
alert(document.body.innerHTML);
}
// Self executing function
theScript.innerHTML = '(' + injectThis.toString() + '());';
theWindow.onload = function () {
// Append the script to the new window's body.
// Only seems to work with `this`
this.document.body.appendChild(theScript);
};
And if for some reason you want to use eval:
var theWindow = window.open('http://stackoverflow.'),
theScript;
function injectThis() {
// The code you want to inject goes here
alert(document.body.innerHTML);
}
// Self executing function
theScript = '(' + injectThis.toString() + '());';
theWindow.onload = function () {
this.eval(theScript);
};
What this does (Explanation for the first bit of code. All examples are quite similar):
- Opens the new window
- Gets a reference to the new window's
document
- Creates a script element
- Places all the code you want to 'inject' into a function
- Changes the script's
innerHTML
to load said function when the window loads, with thewindow.onload
event (you can also useaddEventListener
). I usedtoString()
for convenience, so you don't have to concatenate a bunch of strings.toString
basically returns the wholeinjectThis
function as a string. - Appends the script to the new window's
document.body
, it won't actually append it to the document that is loaded, it appends it before it loads (to an empty body), and that's why you have to usewindow.onload
, so that your script can manipulate the new document.
It's probably a good idea to use window.addEventListener('load', injectThis.toString());
instead of window.onload
, in case you already have a script within your new page that uses the window.onload
event (it'd overwrite the injection script).
Note that you can do anything inside of the injectThis
function: append DIVs, do DOM queries, add even more scripts, etc...
Also note that you can manipulate the new window's DOM inside of the theWindow.onload
event, using this
.
Yes...
var w = window.open(<your local url>);
w.document.write('<html><head>...</head><body>...</body></html>');
Here's a trick I use, it uses query strings, and is client side. Not perfect but it works:
On the sending page, do:
var javascriptToSend = encodeURIComponent("alert('Hi!');");
window.open('mypage.html?javascript=' + javascriptToSend);
Replace mypage.html
with your page. Now on the receiving page, add:
(location.href.match(/(?:javascript)=([^&]+)/)[1])&&eval(decodeURIComponent(location.href.match(/(?:javascript)=([^&]+)/)[1]));
You'll have to do some back-and forth to make sure this works.
If you HAVE PHP you can use this more reliable solution on the receiving page:
eval(decodeURIComponent(<?=$_GET['javascript'] ?>));