Como acessar o Iframe pai a partir do JavaScript

Bem, eu tenho um IFrame, que chama uma mesma página de domínio. Meu problema é que desejo acessar algumas informações desse iframe pai a partir desta página chamada (do JavaScript). Como posso acessar este Iframe?

Detalhes: Existem vários iframes como este, que podem ter a mesma página carregada, porque estou programando um ambiente Windows. Pretendo fechar esse Iframe, é por isso que preciso saber o que devo fechar de dentro dele. Eu tenho uma matriz mantendo referências a esses iframes.

EDIT: Existem iframes gerados dinamicamente

Também é possível definir nome e ID com valores iguais

<iframe id="frame1" name="frame1" src="any.html"></iframe>

então você poderá usar o próximo código na página filho

parent.document.getElementById(window.name);

Basta ligar window.frameElementda sua página emoldurada. Se a página não estiver em um quadro, frameElementserá null.

A outra maneira (obter o elemento da janela dentro de um quadro é menos trivial), mas por uma questão de integridade:

/**
 * @param f, iframe or frame element
 * @return Window object inside the given frame
 * @effect will append f to document.body if f not yet part of the DOM
 * @see Window.frameElement
 * @usage myFrame.document = getFramedWindow(myFrame).document;
 */
function getFramedWindow(f)
{
    if(f.parentNode == null)
        f = document.body.appendChild(f);
    var w = (f.contentWindow || f.contentDocument);
    if(w && w.nodeType && w.nodeType==9)
        w = (w.defaultView || w.parentWindow);
    return w;
}

Eu recomendaria o uso da API postMessage .

No seu iframe, ligue para:

window.parent.postMessage({message: 'Hello world'}, 'http://localhost/');

Na página você está incluindo o iframe, pode ouvir eventos como este:

window.addEventListener('message', function(event) {
      if(event.origin === 'http://localhost/')
      {
        alert('Received message: ' + event.data.message);
      }
      else
      {
        alert('Origin not allowed!');
      }

    }, false);

A propósito, também é possível fazer chamadas para outras janelas, e não apenas iframes.

Leia mais sobre a API postMessage no blog de John Resigs aqui

Pergunta antiga, mas eu só tive esse mesmo problema e encontrei uma maneira de obter o iframe. É simplesmente uma questão de iterar pela matriz de quadros [] da janela pai e testar o contentWindow de cada quadro na janela em que seu código está sendo executado. Exemplo:

var arrFrames = parent.document.getElementsByTagName("IFRAME");
for (var i = 0; i < arrFrames.length; i++) {
  if (arrFrames[i].contentWindow === window) alert("yay!");
}

Ou, usando jQuery:

parent.$("iframe").each(function(iel, el) {
  if(el.contentWindow === window) alert("got it");
});

Esse método economiza a atribuição de um ID a cada iframe, o que é bom no seu caso, pois eles são criados dinamicamente. Não consegui encontrar uma maneira mais direta, já que você não pode obter o elemento iframe usando window.parent - ele vai diretamente para o elemento da janela pai (ignorando o iframe). Então, percorrê-los parece a única maneira, a menos que você queira usar IDs.

você pode usar parentpara acessar a página pai. Portanto, para acessar uma função, seria:

var obj = parent.getElementById('foo');

Depois que o id do iframe estiver definido, você poderá acessar o iframe no documento interno, como mostrado abaixo.

var iframe = parent.document.getElementById(frameElement.id);

Funciona bem no IE, Chrome e FF.

Talvez apenas use

window.parent

no iframe para obter o quadro de chamada / janelas. Se você tinha vários quadros de chamada, pode usar

window.top

Tente isso, em seu quadro pai, configure IFRAMEs assim:

<iframe id="frame1" src="inner.html#frame1"></iframe>
<iframe id="frame2" src="inner.html#frame2"></iframe>
<iframe id="frame3" src="inner.html#frame3"></iframe>

Observe que o ID de cada quadro é passado como uma âncora no src.

então, em seu html interno, você pode acessar o ID do quadro em que ele é carregado via location.hash:

<button onclick="alert('I am frame: ' + location.hash.substr(1))">Who Am I?</button>

você pode acessar parent.document.getElementById () para acessar a tag iframe de dentro do iframe

// just in case some one is searching for a solution
function get_parent_frame_dom_element(win)
{
    win = (win || window);
    var parentJQuery = window.parent.jQuery;
    var ifrms = parentJQuery("iframe.upload_iframe");
    for (var i = 0; i < ifrms.length; i++)
    {
        if (ifrms[i].contentDocument === win.document)
            return ifrms[i];
    }
    return null;
}