如何在iframe的本地范围内执行注入的javascript代码？

我在iframe中加载了一个html文档。
我用javascript为该文档开发了一些弹出菜单代码，并将代码从主文档注入iframe

但是我的代码在iframe中不起作用，因为它使用了“

document

”对象，而这意外地引用了主文档而不是iframe文档

我也会处理内容选择，我需要

window.getSelection（）

返回到主文档的选择，我需要

window.frames[0].getSelection（）

我做错什么了吗？
有什么简单的方法可以克服这个问题吗

更新：（澄清）
正如Bergi所指出的，我的问题是如何正确运行注入的javascript代码，以便在iframe中获得局部范围而不是全局范围？
因此，我不必重写代码中的

文档

和

窗口

更新： （我的html的框架）

[
...
]

脚本如下（使用jquery）：

$（函数（）{
$（'iframe'）.load（函数（）{
var$doc=$（'iframe'）.contents（）；
变量$head=$（'head'，$doc）；
$head.附加（“”）；
变量$body=$（'body'，$doc）；
$body.append（'\
\
\
');
$body.append（'\
\
console.log（document.body）；//它仍然显示全局正文\
\
');
});
});

---

更新：

最后，我找到了答案

如果使用jQuery像

$body.append（“”）

那样附加代码，那么由

document.createElement（'script'）

创建的“”元素将成为全局文档的一部分。即使将其插入到iframe文档中，它也将在全局命名空间中执行

因此，解决方案是——利用这个绝妙的解决方案：（）——回到普通的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'）.load（函数（）{
var$doc=$（'iframe'）.contents（）；
变量$head=$（'head'，$doc）；
$head.附加（“”）；
变量$body=$（'body'，$doc）；
$body.append（“”）；//非javascript内容可以正常工作
var doc=$（'iframe'）.contents（）[0]；//doc=$doc[0]由于某些原因无法工作。。。
var script=doc.createElement（“脚本”）；
setAttribute（“type”、“text/javascript”）；
script.textContent=“console.log（document.body）”；//这将是iframe的正文
$body[0]。appendChild（脚本1）；//$body.append（…）不起作用
});

取决于您如何将代码注入iframe-请向我们展示该代码片段。如果你做得不对，代码仍然在父文档的全局范围内执行。@Bergi谢谢，我已经按照你的要求更新了我的问题。你说

/scripts/book弹出菜单.js

是在

文档

指向父框架的情况下执行的？是的，没错。我做错了什么？我还不知道发生了什么，但我可以确认这个问题。我想你也可以使用类似

$（“#popup“，$doc）.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> \
');
});
});

$('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
});