So wählen Sie ein Element in iframe mit document.getElementById aus

Question 1

Ich habe iframeso etwas

<iframe name="myframe1" id="myframe1" width="100%" height="100%" src="a.html">
<html>
    <head></head>
    <frameset name="myframe2" cols="0%, 100%" border="0" frameBorder="0" frameSpacing="0">
        <frame name="page1" src="c.html" scrolling="no"></frame>
        <frame name="page2" src="d.html" >
            <html>
                <head></head>
                <body id="top">
                    <div id="div1">
                        <div id="div2">
                            <div id="div3">
                                <ul id="x">
                                    <li>a</li>
                                    <li>b</li>
                                </ul>
                            </div>
                        </div>
                    </div>
                </body>
            </html>

        </frame>

    </frameset>
</html>
</iframe>

Ich möchte auf das Element "x" verweisen. Ich habe es auf verschiedene Arten versucht, aber ich konnte keine Lösung finden.

Question 2

document.getElementById('myframe1').contentWindow.document.getElementById('x')

Geige

contentWindow wird von allen Browsern unterstützt, einschließlich der älteren Versionen von IE.

Beachten Sie, dass , wenn die iframe‚s srcaus einer anderen Domäne ist, werden Sie nicht in der Lage sein , seine Inhalte zugreifen aufgrund der Same Origin Policy .

Question 3

verwenden contentDocument, um dies zu erreichen

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

var ulObj = innerDoc.getElementById("ID_TO_SEARCH");

Question 4

(Dies soll die gewählte Antwort ergänzen)

Stellen Sie sicher, dass das iframevor Ihnen geladen ist

contentWindow.document

Andernfalls wird Ihr getElementByIdsein null.

PS: Kann nicht kommentieren, immer noch eine geringe Reputation, aber dies ist eine Fortsetzung der gewählten Antwort, da ich einige gute Debugging-Zeit damit verbracht habe, herauszufinden, dass ich das iframeLaden erzwingen sollte, bevor ich das Inner-Iframe-Element auswähle.

Question 5

In meinem Fall habe ich versucht, die pdfTron- Symbolleiste aufzurufen , aber leider ändert sich die ID jedes Mal, wenn Sie die Seite aktualisieren .

Also habe ich es mir damit geschnappt.

const pdfToolbar = document.getElementsByTagName('iframe')[0].contentWindow.document.getElementById('HeaderItems');

Wie in dem von tagName geschriebenen Array haben Sie immer den festen Index für iFrames in Ihrer Anwendung.

Question 6

Sie müssen sicherstellen, dass der Frame vollständig geladen ist. Der beste Weg, dies zu tun, ist die Verwendung von Onload:

<iframe id="nesgt" src="" onload="custom()"></iframe>

function custom(){
    document.getElementById("nesgt").contentWindow.document;
    }

Diese Funktion wird automatisch ausgeführt, wenn der Iframe vollständig geladen ist.

Dies könnte mit setTimeout geschehen, aber wir können den genauen Zeitpunkt des Frame-Ladevorgangs nicht ermitteln.

hoffe das hilft jemandem.