Klaus1: Javascript-Funktion ausserhalb des eigenen Objects aufrufbar?

SELF-Forum

Javascript-Funktion ausserhalb des eigenen Objects aufrufbar?

Klaus1 (Versionen)
– Informationen zu den Bewertungsregeln

Hallo,

der Betreff ist etwas vage formuliert, aber mir fiel nichts besseres ein 😟

Ich habe eine HTML-Seite mit ein paar Javascript-Funktionen. Im Body-Teil wird nun auch über ein Object-Tag ein weiteres HTML-Dokument geladen.

Innerhalb vom Body von seite1.html

<object id="test" type="text/html" data="seite2.html"></object>

Habe ich jetzt die Möglichkeit von einer Javascript-Funktion von seite2.html aus eine Javascript-Funktion von seite1.html aufzurufen?

LG Klaus

Beitrag melden
–
Informationen zu den Bewertungsregeln

  1. Javascript-Funktion ausserhalb des eigenen Objects aufrufbar?

    ThomasM
    +1 Informationen zu den Bewertungsregeln

    Hallo Klaus,

    Habe ich jetzt die Möglichkeit von einer Javascript-Funktion von seite2.html aus eine Javascript-Funktion von seite1.html aufzurufen?

    Ansatz:

    seite1.html

    <!DOCTYPE html>
<html lang="de">
  <head>
    <meta charset="UTF-8" />
    <title>Seite 1</title>
    <script>
      function Test()
      {
        alert("Test");
      }
    </script>
  </head>
  <body>
    <h1>Seite 1</h1>
    <object id="test" type="text/html" data="seite2.html"></object>
  </body>
</html>

    seite2.html

    <!DOCTYPE html>
<html lang="de">
  <head>
    <meta charset="UTF-8" />
    <title>Seite 2</title>
    <script>
      document.addEventListener("DOMContentLoaded", function(event)
      {
        document.getElementById("btn").addEventListener("click", function(event)
        {
          parent.Test();
        });
      });
    </script>
  </head>
  <body>
    <button id="btn">Test</button>
  </body>
</html>

    Anklicken des Buttons ruft die Funktion Test() auf. parent liefert das übergeordete window-Objekt. parent.document erlaubt Zugriff auf die Inhalte.

    Grüße,
    Thomas

    Beitrag melden
    +1
    Informationen zu den Bewertungsregeln

  2. Javascript-Funktion ausserhalb des eigenen Objects aufrufbar?

    Orlok (Versionen)
    – Informationen zu den Bewertungsregeln

    Hallo Klaus

    Innerhalb vom Body von seite1.html

    <object id="test" type="text/html" data="seite2.html"></object>

    Habe ich jetzt die Möglichkeit von einer Javascript-Funktion von seite2.html aus eine Javascript-Funktion von seite1.html aufzurufen?

    Nicht direkt, da der Nested Browsing Context den object hier repräsentiert einen eigenen globalen Sichtbarkeitsbereich für Bezeichner erzeugt. Sprich, es werden nicht automatisch die Namensbindungen aus dem umgebenden Kontext "geerbt".

    Da Funktionsdeklarationen und gewöhnliche Variablendeklarationen im globalen Scope von Skripten jedoch zu Eigenschaften auf dem jeweiligen window-Objekt verarbeitet werden, kannst du Funktionen über das window-Objekt des umgebenden Kontextes referenzieren.

    // Im globalen Scope von seite1.html

function foo() {
  console.log('foo');
}


// Oder als Variablendeklaration:

var foo = function() { console.log('foo') };

    Hast du wie oben eine Funktion auf seite1.html deklariert, kannst du von seite2.html aus über die Eigenschaft window.parent auf das window-Objekt des Kontextes von seite1.html zugreifen und die gewünschte Funktion als Methode dieses Objektes aufrufen:

    // Auf seite2.html in irgendeinem Scope

window.parent.foo();

    Variablen und Konstanten die mit den Schlüsselwörtern let und const deklariert werden, können hingegen nicht auf diese Weise referenziert werden, da diese Deklarationen nicht dazu führen, dass entsprechende Eigenschaften auf window definiert werden.

    Allgemein würde ich von einem Konstrukt wie diesem hier, mit dokumentübergreifenden Referenzen, aber abraten. – Da wird es höchstwahrscheinlich eine bessere Lösung geben.

    Viele Grüße,

    Orlok

    --
    „Dance like it hurts.
    Make love like you need money.
    Work when people are watching.“ — Dogbert
    Beitrag melden
    –
    Informationen zu den Bewertungsregeln