Obtener elemento desde un iFrame

¿Cómo se obtiene un <div>dentro de un <iframe>?

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

Podrías más simplemente escribir:

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

y se devolverá el primer documento interno válido.

Una vez que obtenga el documento interno, puede acceder a sus componentes internos de la misma manera que accedería a cualquier elemento en su página actual. ( innerDoc.getElementById... etc.)

IMPORTANTE: Asegúrese de que el iframe esté en el mismo dominio, de lo contrario no podrá acceder a sus componentes internos. Eso sería una secuencia de comandos entre sitios.

No olvide acceder al iframe después de cargarlo . Manera antigua pero confiable sin 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() es función dentro de la página y esa acción de función en ella

Las respuestas anteriores dieron buenas soluciones usando Javscript. Aquí hay una solución simple de jQuery:

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

El truco aquí es el .contents()método de jQuery , a diferencia del .children()que solo puede obtener elementos HTML, .contents()puede obtener tanto nodos de texto como elementos HTML. Es por eso que uno puede obtener el contenido del documento de un iframe al usarlo.

Más información sobre jQuery .contents(): .contents ()

Tenga en cuenta que el iframe y la página deben estar en el mismo dominio.

Ninguna de las otras respuestas me funcionó. Terminé creando una función dentro de mi iframe que devuelve el objeto que estaba buscando:

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

Luego llama a esa función así para recuperar el elemento:

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

Si el iframe no está en el mismo dominio, de modo que no puede obtener acceso a sus componentes internos desde el padre pero puede modificar el código fuente del iframe, entonces puede modificar la página mostrada por el iframe para enviar mensajes a la ventana principal, lo que permite compartir información entre las páginas. Algunas fuentes:

• https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage
• Html5 - Mensaje cruzado del iframe postmensaje - ¿hijo a padre?
• Mensaje cruzado de iframe postMessage de hijo a padre

El siguiente código lo ayudará a encontrar datos de iframe.

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