我怎么能得到注入javascript代码在iframe的局部范围内执行
How can I get injected javascript code executed in local scope in iframe?
我在iframe中加载了一个html文档。
我已经为该文档开发了一些javascript弹出菜单代码,并将代码从主文档注入iframe。
但是我的代码不能在iframe中工作,因为它使用"document
"对象,并且令人惊讶的是指主文档而不是iframe文档。
我也玩内容选择,我需要window.getSelection()
回到主文档的选择,我需要window.frames[0].getSelection()
代替。
有没有什么简单的解决办法?
更新:(澄清)
正如Bergi指出的那样,我的问题是如何正确运行注入的javascript代码以获得iframe中的局部作用域而不是全局作用域?
所以我做不必须重写document
's和window
's的代码…
更新:(my html的骨架)
<html>
<head></head> <!-- script launches on jquery's $(document).ready -->
<body>
<iframe>
[
<body>
...
<script></script> <!-- code injected here from the code (appended to the body) -->
</body>
]
</iframe>
</body>
</html>
脚本如下(使用jquery):
$(function(){
$('iframe').load(function(){
var $doc = $('iframe').contents();
var $head = $('head', $doc);
$head.append('<link rel="stylesheet" href="/stylesheets/book-popup-menu.css" />');
var $body = $('body', $doc);
$body.append(' '
<div id="popup"> '
</div> '
');
$body.append(' '
<script type="text/javascript"> '
console.log(document.body);// it still displays the global body '
</script> '
');
});
});
UPDATE: A fiddle demonstration the issue
我终于找到了答案!
如果你用jQuery添加代码,比如$body.append('<script>')
,那么"元素将由document.createElement('script')
创建,因此将成为全局文档的一部分。即使在插入iframe文档之后,它将在全局命名空间中执行。
所以解决方案是——利用这个神话般的解决方案:(向Iframe注入Javascript)——回到香草Javascript:
$('iframe').load(function(){
var $doc = $('iframe').contents();
var $head = $('head', $doc);
$head.append('<link rel="stylesheet" href="/stylesheets/book-popup-menu.css" />');
var $body = $('body', $doc);
$body.append('<div id="popup"></div>');// non-javascript content works fine
var doc = $('iframe').contents()[0]; // doc = $doc[0] does not work for some reason...
var script = doc.createElement("script");
script.setAttribute("type", "text/javascript");
script.textContent = "console.log(document.body)"; // this will be iframe's body
$body[0].appendChild(script1); // $body.append(...) does not work
});
相关文章:
- 防止Iframe窗体在新窗口中打开
- 将样式表插入iframe
- 在Twitter上用ie9中的空白src访问iframe的contentWindow
- 使用jQuery从原始页面内容创建iframe
- Highslide(iframe的侦听器)
- iframe正在添加标签,需要删除它们
- 通过javascript/html访问twitter共享iframe
- 如何在Facebook上的iframe应用程序中使后退按钮返回到上一页
- 如何使用Angular动态添加iframe-src
- 由于iframe导致的问题
- 如何解雇“;铁局部存储负载”;事件
- 正在从页面中删除iframe
- 检测iframe是否跨域的愚蠢方法
- 是否可以使用iframe API在iOS浏览器上播放youtube视频
- 如何操作iframe之外的元素
- 如何使用javascript/jquery获取iframe的URL的锚点属性
- 对特定的iframe使用javascript书签
- node-webkit-从父窗口捕获iframe鼠标事件
- 重定向iFrame中的父URL
- 我怎么能得到注入javascript代码在iframe的局部范围内执行