Comment obtenir innerHTML contenu de l'élément iframe

salut, je suis en train d'essayer d'obtenir intérieure HTML de l'élément iframe

mon document html d'une structure, c'est comme cela

<body>
    <div>
        <iframe id="frame1">
            <html>
                <button id="mybutton">click me</button>
            </html>
        </iframe>
    </div>
</body>

je suis entrain de créer une extension chrome je dois afficher une alerte lorsque le bouton avec l'id mybutton est cliqué, j'écris un script contenu

var greeting = "hola, ";

document.body.innerHTML='<div><iframe id="frame1" src="http://onemoredemo.appspot.com/"></iframe></div>' ;

var iframe = document.getElementById("frame1");
var iframeDocument = iframe.contentDocument || iframe.contentWindow.document

var button = iframeDocument.getElementById("mybutton") ;

if(button ==null)
alert("button is null") ;

j'ai installé cette extension dans chrome lorsque je visite une page, alors corps du document est modifié dans une iframe avec un bouton.
mais je suis face à une alerte qui a bouton est nul mais il y a un bouton dans l'iframe pourquoi je suis nulle pour ce bouton??

mais iframeDocument n'est pas nul pour assurer
Peut-être que j'ai mal comprendre, mais où est le domaine de votre page parent? Où est le domaine de votre iframe page?
Si c'est une croix de domaine iframe (je suppose donc que vous avez une url complète de la src) vous ne pouvez pas accéder à l'intérieur des éléments comme les autres iframes. J'utilise de poster des messages pour la communication entre le parent & l'enfant iframe si ils sont dans des domaines différents

OriginalL'auteur Ritesh Mehandiratta | 2013-02-12

  1. 8

    Pour obtenir le bouton à l'intérieur de l'iframe, cela pourrait fonctionner:

    var iframe = document.getElementById("frame1");
var iframeDocument = iframe.contentDocument || iframe.contentWindow.document;
var button = iframeDocument.getElementById("mybutton");

    Évidemment, vous pouvez naviguer pour obtenir ce que vous voulez avec iframeDocument, et l'utilisation .innerHTML comme vous semblez le savoir. Vous ne pouvez pas obtenir le contenu de l'iframe si l'iframe pointant vers un domaine autre que ses parents.

    Mise à JOUR:

    Vous devez utiliser le code pour obtenir l'image du document et de son contenu après c'est prêt, alors vous devriez utiliser quelque chose comme ceci:

    window.onload = function () {
    var greeting = "hola, ";

    var div1 = document.createElement("div");
    var frame1 = document.createElement("iframe");
    frame1.id = "frame1";
    frame1.onload = function () {
        alert("loaded");

        var iframe = document.getElementById("frame1");
        var iframeDocument = iframe.contentDocument || iframe.contentWindow.document;

        var button = iframeDocument.getElementById("mybutton");

        if (button == null) {
            alert("button is null");
        }
    };
    frame1.src = "http://onemoredemo.appspot.com";
    div1.appendChild(frame1);
    document.body.appendChild(div1);
};

    DÉMO: http://jsfiddle.net/nqTnz/

    La chose importante est de savoir comment les éléments sont créés et ajoutés à la DOM - pas seulement à l'aide innerHTML. Le onload méthode de l'iframe est de garantir qu'il est prêt. Le réel de manipulation de code ne fonctionne pas dans le jsFiddle parce que la croix-domaine des problèmes, mais est-ce que vous avez besoin.

    var iframe = document.getElementById("image1"); var iframeDocument = iframe.contentDocument || iframe.contentWindow.document var bouton = iframeDocument.getElementById("mybutton") bouton.la méthode addEventListener("click", function() { alert('Hello World'); }, false); j'obtiens le message d'erreur "Impossible d'appeler la méthode "la méthode addEventListener', null " pourquoi j'obtiens cette erreur iframeDocument n'est pas null
    s'il vous plaît répondre à cette erreur
    Où dans votre code faites-vous appel à ce code que vous avez posté dans le commentaire? Veuillez mettre à jour votre question avec plus de votre code et où tout est utilisé
    je suis entrain de créer une extension chrome et de l'appeler à partir du contenu du script
    J'ai mis à jour ma réponse - vous besoin d'attendre que l'iframe pour être prêt/chargé. Mais vous devez réorganiser la façon dont les éléments sont créés/ajoutée, comme je le suggère dans ma mise à jour.

    OriginalL'auteur Ian

  2. 0

    JQuery dans le code source de la solution pour obtenir de l'iframe document, c'est comme ceci:

    var iframeDocument = iframe.contentDocument || iframe.contentWindow.document;

    Et puis vous pouvez généralement utiliser getElementsByTagName ou getElementById pour sélectionner les DOM-Éléments:

    var elem;
if (iframeDocument) {
   elem = iframeDocument.getElementById('mybutton');
}
    elem = iframeDocument.getElementById ("mybutton"); cette ligne, je suis elem une valeur nulle, mais dans la console il y a un bouton dans un iframe document pour assurer
    avez-vous ajouté de la première ligne?
    Vérifiez si votre bouton est visible dans le navigateur de code..

    OriginalL'auteur Bhushan Firake