javascript 用脚本注入一个打开的窗口
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/29909927/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Inject an opened window with script
提问by DaemonOfTheWest
This questionasks for a way to open a new window using window.openand then inject it with a script. It was not possible because of cross-domain security issues.
这个问题要求一种方法来打开一个新窗口window.open，然后用脚本注入它。由于跨域安全问题，这是不可能的。
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 .writedoes not solve this problem because it wipes all the html from the page first.
请注意，这.write并不能解决此问题，因为它首先会擦除页面中的所有 html。
回答by
You can do something like this:
你可以这样做：
var theWindow = window.open('http://stackoverflow.com'),
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.com'),
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:
如果出于某种原因您想使用 eval：
var theWindow = window.open('http://stackoverflow.com'),
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
innerHTMLto load said function when the window loads, with thewindow.onloadevent (you can also useaddEventListener). I usedtoString()for convenience, so you don't have to concatenate a bunch of strings.toStringbasically returns the wholeinjectThisfunction 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.
- 打开新窗口
- 获取对新窗口的引用
document - 创建脚本元素
- 将您想要“注入”的所有代码放入一个函数中
innerHTML使用window.onload事件（您也可以使用addEventListener）更改脚本以在窗口加载时加载所述函数。我toString()为了方便起见，所以你不必连接一堆字符串。toString基本上将整个injectThis函数作为字符串返回。- 将脚本附加到新窗口的
document.body，它实际上不会将其附加到加载的文档中，而是在加载之前将其附加（到空主体），这就是您必须使用的原因window.onload，以便您的脚本可以操作新文件。
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.onloadevent (it'd overwrite the injection script).
如果您的新页面中已经有一个使用该事件的脚本（它会覆盖注入脚本），那么使用window.addEventListener('load', injectThis.toString());代替可能是一个好主意。window.onloadwindow.onload
Note that you can do anything inside of the injectThisfunction: append DIVs, do DOM queries, add even more scripts, etc...
请注意，您可以在injectThis函数内部执行任何操作：附加 DIV、执行 DOM 查询、添加更多脚本等...
Also note that you can manipulate the new window's DOM inside of the theWindow.onloadevent, using this.
另请注意，您可以在theWindow.onload事件内部操作新窗口的 DOM ，使用this.
回答by Shawn Jacobson
Yes...
是的...
var w = window.open(<your local url>);
w.document.write('<html><head>...</head><body>...</body></html>');
回答by Downgoat
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.htmlwith your page. Now on the receiving page, add:
替换mypage.html为您的页面。现在在接收页面上，添加：
(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如果你有 PHP，你可以在接收页面上使用这个更可靠的解决方案：
eval(decodeURIComponent(<?=$_GET['javascript'] ?>));
