[Javascript] verzögertes Ausführung von Javascript in externer Datei



  • Wie kann ich eine externen Javascript ausführen, nachdem die Seite vollständig geladen wurde? Im Moment wird nach einem Timeout eine Funktion aus die irgendetwas macht (z.B. URL zu einem Javascript erzeugen) und danach eine weitere Funktion ausführt, die diese URL einem dynamisch erzeugten script-Element zuweist. Das funktioniert so weit. Die URL wird ausgeführt. Allerdings geht aber der Inhalt der Seite verloren und man bekommt eine neue leere Seite angezeigt (mit dem Ergebnis des Scripts).

    Wie kann man verhindern, das die alte Seite verschwindet und stattdessen das Ergebnis des Javascripts direkt in der alten Seit angezeigt wird?

    <div id="MyDiv">
    	<script type="text/javascript">
    	<!--
    
    		function LoadExternScript(URL)
    		{
    			var ScriptElement = document.createElement("script");
    
    			ScriptElement.src  = URL;
    			ScriptElement.type = "text/javascript";
    
    			document.getElementById("MyDiv").appendChild(ScriptElement);
    
    		//			document.getElementsByTagName("head")[0].appendChild(ScriptElement);
    		}
    
    		function DelayedExecute()
    		{
    			// do something
    			// ...
    
    			LoadExternScript("http://url_to_execute.de");
    		}
    
    		window.setTimeout("DelayedExecute()", 2000);
    
    	-->
    	</script>
    </div>
    

    Danke!



  • Wieso da jetzt ne neue, leere Seite angezeigt wird kann ich Dir leider nicht sagen, hab' jetzt auch keine Zeit das zu testen, aber wenn Du die Funktion ausführen willst, sobald die komplette Seite geladen ist, dann kannst Du den Funktionsaufruf auch einfach in das onload-Attribut des body-Tags packen, also z.B. so:

    ...
    <body onload="DelayedExecute()">
    ...
    

    Dann wird die Funktion aufgerufen, sobald die komplette Seite geladen ist.



  • http://amix.dk/blog/viewEntry/174

    ist eine intressante methode



  • deine idee ist nicht schlecht, aber ich denke mal, das andere script benutzt document.write, und document.write löscht erstmal die alte seite, bevor es was neues schreibt.
    wenn das script auf dem selben server liegt, wäre eine möglichkeit es mit einem XMLHttpRequest() auszulesen, dann alle document.write( gegen "myWrite(" zu ersetzen, myWrite als:
    function myWrite( text ) { myBuffer += text; }
    zu definieren, und mit eval() das neue script ausführen,
    und dann myBuffer in den div einfügen: document.getElementByID( 'theDiv' ).innerHTML = myBuffer;
    habs nicht getestet, müsste aber funktionieren.

    oder du passt das script gelich so an, dass es immer per document.getElementByID( 'theDiv' ).innerHTML += "blabla"; in den div schreit, und kein document.write benutzt



  • afair würde das auf diese art und weise auf ein paar browsern probleme bereiten

    anständig würde sowas funktionieren, wenn man folgende codeschnipsel benutzt:

    var getXMLHttpRequest = function() {
        var try_these = [
          function () { return new XMLHttpRequest(); },
          function () { return new ActiveXObject('Msxml2.XMLHTTP'); },
          function () { return new ActiveXObject('Microsoft.XMLHTTP'); },
          function () { return new ActiveXObject('Msxml2.XMLHTTP.4.0'); },
          function () { throw "Browser does not support XMLHttpRequest"; }
        ];
        for (var i = 0; i < try_these.length; i++) {
          var func = try_these[i];
          try {
            return func();
          } catch (e) {
          }
        }
      }
    

    und fals man noch scripte aus anderen html files holen muss

    var evalScriptTags = function(html) {
        var script_data = html.match(/<script.*?>((\n|\r|.)*?)<\/script>/g);
        if(script_data != null) {
          for(var i=0; i < script_data.length; i++) {
            var script_only = script_data[i].replace(/<script.*?>/g, "");
            script_only = script_only.replace(/<\/script>/g, "");
            eval(script_only);
          }
        }
    

    weshalb ich die vorgestellte methode aus meinem link bevorzugen würde



  • Aber ich glaube deine in dem Link vorgestellte Methode ändert nichts daran, dass die Seite durch document.write "überschrieben" wird, und ist somit für den Threadersteller nicht zu gebrauchen...
    (habs aber nicht getestet, denk ich aber so 🙂 )



  • nein - die methode verwendet dom, um elemente anzufügen

    dabei fügt es an den head tag weitere script-tags an

    das ist ein erheblicher unterschied ...



  • Das ist mir schon klar. Aber dann wird das eingefügt Javascript vom Browser herunter geladen und ausgeführt. Und wenn dadrinne document.write vorkommt, dann müsste die Seite trotzdem "überschrieben" werden.



  • So jetzt hier nochmal n Beispiel:

    <html>
    	<head>
    		<script>
    			function AddScript( script ) {
    				var node = document.createElement( "script" );
    				node.src = script;
    				node.type = "text/javascript";
    				document.getElementsByTagName( "head" )[0].appendChild( node );
    			};
    
    		</script>
    	</head>
    	<body>
    		<div id='myDiv'>
    			Hallo Welt
    			<a href='javascript:AddScript( "test_1.js" );'>Script1</a>
    			<a href='javascript:AddScript( "test_2.js" );'>Script2</a>
    		</div>
    	</body>
    </html>
    

    test_1.js:

    document.write( <br>"dies ist vom script 1 geschrieben" );
    

    test_2.js:

    document.getElementById( 'myDiv' ).innerHTML += "<br>vom script 2";
    


  • das ist dann aber selbst schuld ....


Anmelden zum Antworten