2009-11-25 64 views
85

¿Cómo puedo acceder al contenido de un iframe con jQuery? He intentado hacer esto, pero no iba a funcionar:¿Cómo acceder al contenido de un iframe con jQuery?

contenido anidado:<div id="myContent"></div>

jQuery:$("#myiframe").find("#myContent")

Cómo puedo acceder a myContent?


Similar tojquery/javascript: accessing contents of an iframe but the accepted answer is not what I was looking for.

+0

Acabo de descubrir que la variable de $ incorporada en la consola de Firefox no parece en absoluto una jQuery completa. (Me di cuenta de esto después de darme cuenta de que no tengo la variable jQuery tampoco, y luego de pensar que no cargué el código fuente de jQuery). –

Respuesta

160

usted tiene que utilizar el contents() método:

$("#myiframe").contents().find("#myContent") 

Fuente: http://simple.procoding.net/2008/03/21/how-to-access-iframe-in-jquery/

+3

dame el error: Error: Permiso denegado para acceder a la propiedad 'ownerDocument' –

+22

ime: Probablemente te dé error por los siguientes motivos: 1) Iframe no pertenece al mismo dominio. 2) Está tratando de leerlo antes del evento Iframe load. – iMatoria

+0

¿Hay alguna manera de verificar si el contenido del iframe pertenece al mismo dominio, antes de intentar acceder y obtener un error? – Kamafeather

15
<html> 
<head> 
<title></title> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.js"></script> 
<script type="text/javascript"> 

$(function() { 

    //here you have the control over the body of the iframe document 
    var iBody = $("#iView").contents().find("body"); 

    //here you have the control over any element (#myContent) 
    var myContent = iBody.find("#myContent"); 

}); 

</script> 
</head> 
<body> 
    <iframe src="mifile.html" id="iView" style="width:200px;height:70px;border:dotted 1px red" frameborder="0"></iframe> 
</body> 
</html> 
12

Si la fuente de marco flotante es un dominio externo, navegadores ocultará el contenido de iframe (La misma política de origen). Una solución alternativa es el ahorro de los contenidos externos en un archivo, por ejemplo (en PHP):

<?php 
    $contents = file_get_contents($external_url); 
    $res = file_put_contents($filename, $contents); 
?> 

a continuación, obtener el nuevo contenido del archivo (cadena) y analizarlo a html, por ejemplo (en jQuery):

$.get(file_url, function(string){ 
    var html = $.parseHTML(string); 
    var contents = $(html).contents(); 
},'html'); 
Cuestiones relacionadas