Como obter uma referência ao objeto de janela de um iframe dentro do manipulador onload do iframe criado a partir da janela pai

Question

Apr 15, 2013, 05:05 PM

Como obter uma referência ao objeto de janela de um iframe dentro do manipulador onload do iframe criado a partir da janela pai

Antes de colar qualquer código, veja o cenário:Eu tenho um documento HTML que cria um iframe vazio usando JavaScriptO JavaScript cria uma função e anexa uma referência a essa função ao objeto de documento do iframe (usandodoc.open() para obter uma referência ao documento)A função é então anexada como umonload manipulador para o documento do iframe (escrevendo<body onload="..."> no iframe.

Agora, o que me deixou perplexo é que os objetos globais (janela) e documento dentro do manipulador onload (enquanto ele está em execução) são diferentes dos mesmos objetos executados através do JavaScript adicionado por nós de script.

Aqui está o HTML:

<!doctype html>
<html>
<head>
<script>
(function(){
  var dom,doc,where,iframe;

  iframe = document.createElement('iframe');
  iframe.src="javascript:false";

  where = document.getElementsByTagName('script')[0];
  where.parentNode.insertBefore(iframe, where);

  doc = iframe.contentWindow.document;

  var _doc = document;

  doc.open()._l=function() {
    // the window object should be the one that doc is inside
    window.vanishing_global=new Date().getTime();

    var js = this.createElement("script");
    js.src = 'test-vanishing-global.js?' + window.vanishing_global;

    window.name="foobar";
    this.foobar="foobar:" + Math.random();
    document.foobar="barfoo:" + Math.random();

    // `this` should be the document object, but it's not
    console.log("this == document: %s", this == document);
    console.log("this == doc:      %s", this == doc);

    // the next two lines added based on @Ian's comment below
    console.log("_doc == document: %s", _doc == document);
    console.log("_doc == doc:      %s", _doc == doc);

    console.log("name: " + window.name + "\n" + "window.vanishing_global: " + window.vanishing_global + "\ntypeof window.vanishing_global: " + typeof window.vanishing_global + "\ndocument.foobar: " + document.foobar);
    this.body.appendChild(js);
  };
  doc.write('<body onload="document._l();"></body>');
  doc.close();
})();
</script>
</head>
<body>
</body>
</html>

E aqui estátest-vanishing-global.js:

console.log("name: " + window.name + "\n" + "window.vanishing_global: " + window.vanishing_global + "\ntypeof window.vanishing_global: " + typeof window.vanishing_global + "\ndocument.foobar: " + document.foobar);

Instruções:

Coloque esses dois arquivos em um diretório e abra o HTML em um navegador (testado no Chrome e no Firefox mais recentes, o mesmo resultado em ambos).

Esta é a saída que recebo:

this == document: false
this == doc:      true
_doc == document: true
_doc == doc:      false

name: foobar
window.vanishing_global: 1366037771608
typeof window.vanishing_global: number
document.foobar: barfoo:0.9013048021588475

name: 
window.vanishing_global: undefined
typeof window.vanishing_global: undefined
document.foobar: foobar:0.5015988759696484

othis objeto dentro do manipulador deve ser o objeto do documento. istoé um objeto de documento, mas não o mesmo objeto de documento que o documento que ele executa (também não é o mesmo que o documento pai). O objeto de janela dentro do manipulador também não é o mesmo que o objeto de janela executado no JavaScript carregado na página.

Então, finalmente, minha pergunta:

Alguém sabe o que está acontecendo e como eu posso obter uma referência para o objeto de janela real ou pelo menos declarar e fazer referência a variável global do mesmo contexto global?

Notas de rodapé:

Não há problemas de vários domínios com este iframe, pois estão no mesmo domínio. Há um problema se alguém definirdocument.domain, mas isso não está sendo feito neste código de exemplo.