Wie füge ich nach dem Laden der Seite dynamisch ein <script> -Tag über jQuery ein?

Ich habe Probleme damit. Ich habe zuerst versucht, meine Skript-Tags als Zeichenfolgen festzulegen und sie dann nach dem Laden der Seite mit jquery replaceWith () zum Dokument hinzuzufügen:

var a = '<script type="text/javascript">some script here</script>';
$('#someelement').replaceWith(a);

Aber ich habe String-Literal-Fehler auf dieser Var. Ich habe dann versucht, die Zeichenfolge wie folgt zu codieren:

var a = '&left;script type="text/javascript">some script here<\/script>';

Wenn Sie dies jedoch an die replaceWith()Ausgabe senden, wird nur diese Zeichenfolge an den Browser ausgegeben.

Kann mir bitte jemand mitteilen, wie Sie <script>nach dem Laden der Seite dynamisch ein Tag in den Browser einfügen würden, idealerweise über jQuery?

Sie können das Skript in eine separate Datei $.getScripteinfügen und dann zum Laden und Ausführen verwenden.

Beispiel:

$.getScript("test.js", function(){
    alert("Running test.js");
});

Versuche Folgendes:

<script type="text/javascript">
// Use any event to append the code
$(document).ready(function() 
{
    var s = document.createElement("script");
    s.type = "text/javascript";
    s.src = "http://scriptlocation/das.js";
    // Use any selector
    $("head").append(s);
});

http://api.jquery.com/append

Hier ist der richtige Weg, dies mit modernem (2014) JQuery zu tun:

$(function () {
  $('<script>')
    .attr('type', 'text/javascript')
    .text('some script here')
    .appendTo('head');
})

oder wenn Sie wirklich ein div ersetzen möchten, können Sie Folgendes tun:

$(function () {
  $('<script>')
    .attr('type', 'text/javascript')
    .text('some script here')
    .replaceAll('#someelement');
});

Ein einfacher Weg ist:

$('head').append('<script type="text/javascript" src="your.js"></script>');

Sie können dieses Formular auch zum Laden von CSS verwenden.

Diese Antwort ist technisch ähnlich oder entspricht der Antwort von jcoffland. Ich habe gerade eine Abfrage hinzugefügt, um festzustellen, ob bereits ein Skript vorhanden ist oder nicht. Ich brauche das, weil ich auf einer Intranet-Website mit einigen Modulen arbeite, von denen einige Skripte freigeben oder ihre eigenen mitbringen, aber diese Skripte müssen nicht jedes Mal neu geladen werden. Ich verwende dieses Snippet seit mehr als einem Jahr in einer Produktionsumgebung. Es funktioniert wie ein Charme. Kommentar zu mir selbst: Ja, ich weiß, es wäre richtiger zu fragen, ob eine Funktion existiert ... :-)

if (!$('head > script[src="js/jquery.searchable.min.js"]').length) {
    $('head').append($('<script />').attr('src','js/jquery.searchable.min.js'));
}

Es gibt eine Problemumgehung, die eher nach einem Hack klingt, und ich stimme zu, dass dies nicht die eleganteste Art ist, aber zu 100% funktioniert:

Angenommen, Ihre AJAX-Antwort ist so etwas wie

<b>some html</b>
<script>alert("and some javscript")

Beachten Sie, dass ich das schließende Tag absichtlich übersprungen habe. Gehen Sie dann in dem Skript, das das oben genannte lädt, wie folgt vor:

$.ajax({
    url: "path/to/return/the-above-js+html.php",
    success: function(newhtml){
        newhtml += "<";
        newhtml += "/script>";
        $("head").append(newhtml);
    }
});

Frag mich einfach nicht warum :-) Dies ist eines der Dinge, zu denen ich als Ergebnis verzweifelter, fast zufälliger Versuche gekommen bin und die fehlgeschlagen sind.

Ich habe keine vollständigen Vorschläge, wie es funktioniert, aber interessanterweise funktioniert es NICHT, wenn Sie das schließende Tag in einer Zeile anhängen.

In Zeiten wie diesen habe ich das Gefühl, erfolgreich durch Null geteilt zu haben.

Beispiel:

var a = '<script type="text/javascript">some script here</script>';
$('#someelement').replaceWith(a);

Es sollte funktionieren. Ich versuchte es; gleiches Ergebnis. Aber als ich das benutzte:

var length = 1;
var html = "";
for (var i = 0; i < length; i++) {
    html += '<div id="codeSnippet"></div>';
    html += '<script type="text/javascript">';
    html += 'your script here';
    html += '</script>';
}
$('#someElement').replaceWith(a);

Das hat bei mir funktioniert.

Edit: Ich habe das vergessen #someelement(übrigens möchte ich vielleicht verwenden#someElement wegen Konventionen verwenden)

Das Wichtigste hier ist das + =, damit das HTML hinzugefügt und nicht ersetzt wird.

Hinterlasse einen Kommentar, wenn es nicht funktioniert hat. Ich würde dir gerne helfen!

Hier ist ein viel klarerer Weg - keine Notwendigkeit für jQuery -, der ein Skript als letztes untergeordnetes Element von Folgendes hinzufügt <body>:

document.body.innerHTML +='<script src="mycdn.js"><\/script>'

Wenn Sie jedoch Skripte hinzufügen und laden möchten, verwenden Sie die Methode von Rocket Hazmat .

Wenn Sie versuchen, dynamisch generiertes JavaScript auszuführen, ist die Verwendung von JavaScript etwas besser eval. JavaScript ist jedoch eine so dynamische Sprache, dass Sie das wirklich nicht brauchen sollten.

Wenn das Skript statisch ist, ist Rockets getScript-Vorschlag der richtige Weg.