Stefan Z.: Externes Script einfügen

Hi Leute,

ich habe folgendes Problem. Ich will auf meiner Homepage auf ein externes Javascript verweisen. Der Code schaut folgendermaßen aus:

<script type="text/javascript" language="javascript" src="xyz"></script>

wobei das "xyz" auf die andere homepage geht.

Diesen Code habe ich eingebaut, will aber nicht, dass er gleich geladen wird, wenn die Seite aufgerufen wird. Da die Seite oft aufgerufen wird, würde das nur eine Belastung des anderen Servers bedeuten.
Anstattdessen will ich, dass der Code erst ausgeführt wird, wenn man auf einen Link auf der Seite klickt.

Über diesen Link, wird ein Bereich der Homepage sichtbar (über Style-Klassen). Und bevor dieser Bereich sichtbar wird, soll er auf die externe Seite zugreifen. Davor aber nicht.

Wie kann ich das machen?
Kann mir jemand helfen?

Gruß,
Stefan

  1. Hi Leute,

    ich habe folgendes Problem. Ich will auf meiner Homepage auf ein externes Javascript verweisen. Der Code schaut folgendermaßen aus:

    <script type="text/javascript" language="javascript" src="xyz"></script>

    wobei das "xyz" auf die andere homepage geht.

    Diesen Code habe ich eingebaut, will aber nicht, dass er gleich geladen wird, wenn die Seite aufgerufen wird. Da die Seite oft aufgerufen wird, würde das nur eine Belastung des anderen Servers bedeuten.
    Anstattdessen will ich, dass der Code erst ausgeführt wird, wenn man auf einen Link auf der Seite klickt.

    Über diesen Link, wird ein Bereich der Homepage sichtbar (über Style-Klassen). Und bevor dieser Bereich sichtbar wird, soll er auf die externe Seite zugreifen. Davor aber nicht.

    Wie kann ich das machen?
    Kann mir jemand helfen?

    Gruß,
    Stefan

    Hallo Stefan!
    Eine Möglichkeit wäre es per PHP zu lösen. Mir ist auf die schnelle nichts besseres eingefallen:

    <html>
    <head>
    <title>Javascript</title>
    <?php if($_GET['js']) echo "<script type='text/javascript' language='javascript' src='xyz'></script>"; ?>
    </head>

    <body>
    <a href="index.php?js=1">Klick!</a>
    </body>
    </html>

    Liebe Grüße
    Thomas

  2. Hallo Stefan.

    Über diesen Link, wird ein Bereich der Homepage sichtbar (über Style-Klassen). Und bevor dieser Bereich sichtbar wird, soll er auf die externe Seite zugreifen. Davor aber nicht.

    Gehe ich recht in der Annahme, dass das Einblenden besagten Bereiches über das externe Script vom anderen Server geregelt wird?

    In jedem Falle solltest du erst beim Laden des Dokumentes den Bereich ausblenden, da sonst Clients ohne JS nichts davon zu sehen bekommen.

    Zudem solltest du den Link wohl eher gegen einen Button austauschen. Oder wird im Falle des Nichtvorhandenseins von JS wirklich eine Ressource aufgerufen? Merke: sollen einfach nur Aktionen ausgeführt werden, sind Buttons und bei tatsächlichen Referenzierungen Links die erste Wahl.

    Im onclick-Attribut kannst du nun entweder direkt folgend Beschriebenes ausführen, oder dieses in eine Funktion auslagern.

    Wird nun also auf diesen Link (bzw. Button) geklickt, so erstellst du ein script-Element, verpasst ihm die erforderlichen Attribute type und src und hängst in das head-Element ein. Dieses kannst du beispielsweise per document.getElementsByTagName('head')[0] leicht erreichen.

    Wichtig ist hier lediglich, dass das Script, welches das script-Element einhängt zuerst ausgeführt wird und erst darauf folgend der eigentliche Funktionsaufruf.

    Einen schönen Sonntag noch.

    Gruß, Ashura

    --
    sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
    „It is required that HTML be a common language between all platforms. This implies no device-specific markup, or anything which requires control over fonts or colors, for example. This is in keeping with the SGML ideal.“
    [HTML Design Constraints: Logical Markup]
    1. Hallo Stefan.

      Über diesen Link, wird ein Bereich der Homepage sichtbar (über Style-Klassen). Und bevor dieser Bereich sichtbar wird, soll er auf die externe Seite zugreifen. Davor aber nicht.

      Gehe ich recht in der Annahme, dass das Einblenden besagten Bereiches über das externe Script vom anderen Server geregelt wird?

      In jedem Falle solltest du erst beim Laden des Dokumentes den Bereich ausblenden, da sonst Clients ohne JS nichts davon zu sehen bekommen.

      Zudem solltest du den Link wohl eher gegen einen Button austauschen. Oder wird im Falle des Nichtvorhandenseins von JS wirklich eine Ressource aufgerufen? Merke: sollen einfach nur Aktionen ausgeführt werden, sind Buttons und bei tatsächlichen Referenzierungen Links die erste Wahl.

      Im onclick-Attribut kannst du nun entweder direkt folgend Beschriebenes ausführen, oder dieses in eine Funktion auslagern.

      Wird nun also auf diesen Link (bzw. Button) geklickt, so erstellst du ein script-Element, verpasst ihm die erforderlichen Attribute type und src und hängst in das head-Element ein. Dieses kannst du beispielsweise per document.getElementsByTagName('head')[0] leicht erreichen.

      Wichtig ist hier lediglich, dass das Script, welches das script-Element einhängt zuerst ausgeführt wird und erst darauf folgend der eigentliche Funktionsaufruf.

      Einen schönen Sonntag noch.

      Gruß, Ashura

      Hi Ashura,

      was stimmt an dem script hier nicht? Bei Mozilla überschreibt er die Seite und läd nur das eingehängte script und läd dann ewig weiter und bei anderen browsers passiert garnichts.

      DAS WIRD BEIM LINK AUFGERUFEN:

      var myScript = document.createElement("script");
       var myScriptType = document.createAttribute("type");
       var myScriptLanguage = document.createAttribute("language");
       var myScriptSrc = document.createAttribute("src");

      myScriptType.nodeValue  = "text/javascript";
       myScriptLanguage.nodeValue  = "javascript";
       myScriptSrc.nodeValue  = "www.???.de/...usw.";

      myScript.setAttributeNode(myScriptType);
       myScript.setAttributeNode(myScriptLanguage);
       myScript.setAttributeNode(myScriptSrc);

      var outputArea = document.getElementById("weatherBox");
       outputArea.appendChild(myScript);

      DAS STEHT IM BODY-TEIL IN EINER TABELLE:

      <div id="weatherBox"></div>

      Vielen Dank für deine Hilfe,
      Stefan

      1. Hallo Stefan.

        Vorab: bitte keine Fullquotes. Zitiere nur das, worauf du dich wirklich beziehen möchtest. Danke.

        was stimmt an dem script hier nicht? […]

        var myScript = document.createElement("script");
        var myScriptType = document.createAttribute("type");
        […]
        myScript.setAttributeNode(myScriptType);
        […]
        myScriptType.nodeValue  = "text/javascript";

        Dieses Geraffel kannst du dir sparen. Ein erstelltes script-Element verfügt bereits über alle typischen HTML-Attribute, welche du per JS-Eigenschaften modifizieren kannst. Obiges also ein ganzes Stück kürzer:

        var myScript = document.createElement('script');  
            myScript.type = 'text/javascript';  
            myScript.src = 'http://example.org/script.js';  
          
        document.getElementById('weatherBox').appendChild(myScript);
        

        var myScriptLanguage = document.createAttribute("language");

        Wie du der von mir verlinkten Objektreferenz entnehmen kannst, besitzt das script-Element kein language-Attribut.

        Bei Mozilla überschreibt er die Seite und läd nur das eingehängte script und läd dann ewig weiter und bei anderen browsers passiert garnichts.

        Kann ich nicht nachvollziehen. Dein Script funktioniert hier wie gewünscht.

        Einen schönen Montag noch.

        Gruß, Ashura

        --
        sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
        „It is required that HTML be a common language between all platforms. This implies no device-specific markup, or anything which requires control over fonts or colors, for example. This is in keeping with the SGML ideal.“
        [HTML Design Constraints: Logical Markup]
        1. Hallo Stefan.

          Vorab: bitte keine Fullquotes. Zitiere nur das, worauf du dich wirklich beziehen möchtest. Danke.

          was stimmt an dem script hier nicht? […]

          var myScript = document.createElement("script");
          var myScriptType = document.createAttribute("type");
          […]
          myScript.setAttributeNode(myScriptType);
          […]
          myScriptType.nodeValue  = "text/javascript";

          Dieses Geraffel kannst du dir sparen. Ein erstelltes script-Element verfügt bereits über alle typischen HTML-Attribute, welche du per JS-Eigenschaften modifizieren kannst. Obiges also ein ganzes Stück kürzer:

          var myScript = document.createElement('script');

          myScript.type = 'text/javascript';
              myScript.src = 'http://example.org/script.js';

          document.getElementById('weatherBox').appendChild(myScript);

          
          >   
          > >  var myScriptLanguage = document.createAttribute("language");  
          >   
          > Wie du der von mir verlinkten Objektreferenz entnehmen kannst, besitzt das [script](http://de.selfhtml.org/javascript/objekte/htmlelemente.htm#script)-Element kein language-Attribut.  
          >   
          > > Bei Mozilla überschreibt er die Seite und läd nur das eingehängte script und läd dann ewig weiter und bei anderen browsers passiert garnichts.  
          >   
          > Kann ich nicht nachvollziehen. Dein Script funktioniert hier wie gewünscht.  
          >   
          >   
          > Einen schönen Montag noch.  
          >   
          > Gruß, Ashura  
          >   
            
          Hi Ashura,  
            
          schonmal vielen Dank für deine Erklärungen. Ich bin nicht so fit in JavaScript. Ich glaube das Problem liegt bei mir woanders. Ich glaube es liegt bei mir an meinem speziellen src-Inhalt, weshalb es nicht geht. Ich setze src nämlich auf:  
            
          src='http://www.donnerwetter.de/wetter/net/boxregio.mv?typ=1&plz=97070&color\_bg=FFFFFF&color\_hi=E9E9E9&color\_txt=&width=150'  
            
          Da das offenbar keine .js Datei ist, liegt es vermutlich daran, oder?  
          Ich will halt über nen Link die PLZ in dem src ändern ohne dabei die Seite neu zu laden. Mit dem beschriebenen Code geht das irgendwie nicht.  
            
          Hast du ne Idee woran das liegt und wenn ja, wie und ob man das anders lösen kann?  
            
          Gruß,  
          Stefan
          
          1. Hallo Stefan.

            Hallo Stefan.

            Ich bitte dich noch einmal intänigst KEINE FULLQUOTES mehr zu posten.
            Lies hierzu bitte den entsprechenden Absatz in der Netiquette.

            schonmal vielen Dank für deine Erklärungen. Ich bin nicht so fit in JavaScript.

            Was nicht ist, kann ja noch werden.

            src='http://www.donnerwetter.de/wetter/net/boxregio.mv?typ=1&plz=97070&color_bg=FFFFFF&color_hi=E9E9E9&color_txt=&width=150'

            Da das offenbar keine .js Datei ist, liegt es vermutlich daran, oder?

            Fast. Es wäre kein Problem, wenn die Site wenigstens text/javascript als Content-type-Header schicken würde. Statt dessen wird einfach text/html gesendet, oder--wie ich annehme--gar nichts, weshalb der standardmäßig konfigurierte Header gesendet wird.

            Was sich nun also in diesem „Script“ findet, ist unter aller Sau. Unsere Bemühungen, hier das ganze Vorhaben fein säuberlich per DOM-Methoden durchzuführen, wird damit zunichte gemacht. Per document.writeln werden einfach ein paar HTML-Codezeilen ins Dokument geklatsch, komme was wolle.

            Am gutmütigsten zeigen sich bei mir Firefox und Konqueror. Opera und IE weigern sich, diesen Müll einzubinden.

            Unter diesen Umständen sehe ich keine Möglichkeit, das externe Script erst nachträglich hinzuzuladen. Die write(ln)-Methode überschreibt zwangsläufig das aktuelle Dokument, außer wenn sie während des Ladens des Dokumentes ausgeführt wird.
            Da du nachträglich das Script hinzuladen möchtest, ist zwangsläufig bereits das Dokument geladen, ergo beißt sich die Katze hier in den eigenen Schwanz.

            Ich will halt über nen Link die PLZ in dem src ändern ohne dabei die Seite neu zu laden. Mit dem beschriebenen Code geht das irgendwie nicht.

            Du wirst wohl weiterhin das externe Script mittels script-Element an der passenden Stelle im Dokument dieses Script laden müssen, wenn du es nutzen möchtest. Die vollkommen unflexiblen Techniken, die im Script verwendet wurden, lassen dir hier keine große Wahlmöglichkeit.

            Einen schönen Montag noch.

            Gruß, Ashura

            --
            sh:( fo:} ch:? rl:( br: n4:~ ie:{ mo:| va:) de:> zu:} fl:( ss:) ls:[ js:|
            „It is required that HTML be a common language between all platforms. This implies no device-specific markup, or anything which requires control over fonts or colors, for example. This is in keeping with the SGML ideal.“
            [HTML Design Constraints: Logical Markup]
  3. In Michael Fosters X-Library gibt es eine Funktion xInclude, die macht, was Du brauchst:

    http://www.cross-browser.com/