Ajax: HTML(-Datei) mit externer JS-Datei einfügen

[TIMS_Ralf]

Hallo allseits,

ich generiere mit JS einen HTML-code, der mit einer document-write-function(...) ins Dokument geschrieben wird. Wollte die alte document-write-function(...) nun um jQuery / Ajax erweitern. Funktioniert bestens - nur eines nicht: Wenn das generierte HTML eine externe JS-Datei enthält und nachträglich heran ziehen soll, wie z.B.:

<SCRIPT TYPE="text/javascript" LANGUAGE="JavaScript" SRC="http://code.domain.de/js/html/file.js"></SCRIPT>

dann wird die Datei ENTWEDER nicht herangezogen ODER nicht ausgeführt ODER beides. Das im HTML generierte SCRIPT-Tag steht aber korrekt im generierten Code der Seite. Das gleiche Nix-Passiert, wenn ich den HTML-Code fertig via Ajax als Datei ins Doc hole. Beim alten

document-write('<SCRIPT TYPE="text/javascript" LANGUAGE="JavaScript" SRC="http://code.domain.de/js/html/file.js"></SCRIPT>')

funktioniert das.

Infos:
Ich kann das HTML nicht von Anfang an ins Doc schreiben und ich weiß, dass das Nachladen von HTML-Dateien via Ajax nur online (auf nem Server) funktioniert.

Kann es sein, dass ein nachträglich via Ajax eingefügter Code und/oder heranzezogene, fertige HTML-Datei keine externen Dateien ziehen / ausführen können?

Jemand nen Tipp...? Danke!
Gruß Ralf

 

[Parantatatam]

Du solltest es nicht mit document.write() einfügen, da es dann eher als Text, denn als Anforderung verstanden wird. Erstelle einfach ein neues Element, weise ihm die Eigenschaften zu und füge es dann ins DOM ein:

function loadScript( url ) {
  var head = document.getElementsByTagName( "head" )[0];
  var el = document.createElement( "script" );
  el.type = "application/javascript";
  el.src = url;
  head.appendChild( el );
}

loadScript( "http://code.domain.de/js/html/file.js" );

 

[TIMS_Ralf]

Hallo Crack,
danke erstmal! Ja, will ja meine Scripts "umstellen". Das Dumme ist nur, dass es mit altem "document-write" funktioniert, nur mit Ajax nicht.

Einfügen in den HEAD geht nicht, weil die Scripts im BODY stehen. Die Scripts sind ellenlang, macht kein Sinn, die hier reinzustellen, aber mal beschrieben. Prinzip bspw.: jQuery-Image-Slider:

1. Ich erstelle mehrere statisches Scripts für die engine der Animation: slider_engine_ABC.js
2. Ich generiere mit JS den HTML-Code für die Animation, die auf "Datensätzen" in assoz. Arrays basieren.
3. Ich generiere Animations-Script mit Parametern (Effekte...), aus dem sich dann auch das "ABC" im Dateinamen von slider_engine_ABC.js generiert (ist vorher nicth bekannt).

Der Funktionsaufruf zum Generieren des HTMLs und des Animations-Files erfolgt im BODY oder mit einem Link. Am Ende des generierten HTMLs muß die Datei "slider_engine_4.js" ins Doc geladen werden. Der Code dafür landet im Doc - nur wird die Datei "slider_engine_4.js" entwder nicht ausgeführt oder nicht geladen.
Das dynamisch erzeugte Animationsscript arbeitet hingegen.

Hab jetzt einge Varianten durch, hier zwe Beispiele:

// Snippet 1, um eine externe JS-Datei nachzuladen (Dateiname vorher generiert):
  // .............
  $('#'+pObjID).load("http://code.domain.de/slider_engine_4.js");


// Snippet 2, um eine HTML-Datei zu laden, die den SCRIPT-Tag enthält (Dateiname vorher generiert)::
function InsHtmlFile(pHtmlFile, pObjID, pyOptID)
{
// ....
$.get(pHtmlFile, function(pHtmlFile)    // pHtmlFile: http://...../ani_4.html
{
  $('#'+pObjID).html(pHtmlFile);
})
}

Hoffe, hab mich nicht vertippt / ver-rein-kopiert- Konzentration wankt etwas
Grüße, Ralf