Obter elemento de dentro de um iFrame

Como você obtém um <div>de dentro de um <iframe>?

var iframe = document.getElementById('iframeId');
var innerDoc = (iframe.contentDocument) ? iframe.contentDocument : iframe.contentWindow.document;

Você poderia simplesmente escrever:

var iframe = document.getElementById('iframeId');
var innerDoc = iframe.contentDocument || iframe.contentWindow.document;

e o primeiro documento interno válido será retornado.

Depois de obter o documento interno, você pode acessar seus internos da mesma maneira que acessaria qualquer elemento em sua página atual. ( innerDoc.getElementById... etc)

IMPORTANTE: verifique se o iframe está no mesmo domínio, caso contrário você não poderá obter acesso aos seus internos. Isso seria script entre sites.

Não se esqueça de acessar o iframe após o carregamento . Maneira antiga, mas confiável, sem jQuery:

<iframe src="samedomain.com/page.htm" id="iframe" onload="access()"></iframe>

<script>
function access() {
   var iframe = document.getElementById("iframe");
   var innerDoc = iframe.contentDocument || iframe.contentWindow.document;
   console.log(innerDoc.body);
}
</script>

window.parent.document.getElementById("framekit").contentWindow.CallYourFunction('pass your value')

CallYourFunction() é função dentro da página e essa ação ação nela

As respostas acima deram boas soluções usando Javscript. Aqui está uma solução simples do jQuery:

$('#iframeId').contents().find('div')

O truque aqui é o .contents()método do jQuery , ao contrário.children() que só pode obter elementos HTML, .contents()pode obter nós de texto e elementos HTML. É por isso que é possível obter o conteúdo do documento de um iframe usando-o.

Outras leituras sobre o jQuery .contents(): .contents ()

Observe que o iframe e a página precisam estar no mesmo domínio.

Nenhuma das outras respostas estava funcionando para mim. Acabei criando uma função dentro do meu iframe que retorna o objeto que estava procurando:

function getElementWithinIframe() {
    return document.getElementById('copy-sheet-form');
}

Então você chama essa função assim para recuperar o elemento:

var el = document.getElementById("iframeId").contentWindow.functionNameToCall();

Se o iframe não estiver no mesmo domínio, de modo que você não possa obter acesso a seus internos a partir do pai, mas poderá modificar o código-fonte do iframe, poderá modificar a página exibida pelo iframe para enviar mensagens para a janela pai, o que permite você compartilhar informações entre as páginas. Algumas fontes:

• https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage
• Html5 - Pós-mensagem de Iframe entre navegadores - filho para pai?
• cross-site iframe postMessage de filho para pai

O código abaixo o ajudará a descobrir dados iframe.

let iframe = document.getElementById('frameId');
let innerDoc = iframe.contentDocument || iframe.contentWindow.document;