Wie erzwinge ich das Neuladen und erneute Ausführen eines Skripts?

Question 1

Ich habe eine Seite, die ein Skript von einem Drittanbieter lädt (Newsfeed). Die srcURL für das Skript wird beim Laden dynamisch zugewiesen (pro Code eines Drittanbieters).

<div id="div1287">
    <!-- dynamically-generated elements will go here. -->
</div>

<script id="script0348710783" type="javascript/text">
</script>

<script type="javascript/text">
    document.getElementById('script0348710783').src='http://oneBigHairyURL';
</script>

Das von dort geladene Skript http://oneBigHairyURLerstellt und lädt Elemente mit den verschiedenen Inhalten aus dem div1287Newsfeed , mit hübscher Formatierung usw. in (die ID "div1287" wird übergeben, http://oneBigHairyURLdamit das Skript weiß, wo der Inhalt geladen werden soll).

Das einzige Problem ist, dass es nur einmal geladen wird. Ich möchte, dass es alle n Sekunden neu geladen wird (und somit neue Inhalte anzeigt).

Also dachte ich, ich würde es versuchen:

<div id="div1287">
    <!-- dynamically-generated elements will go here. -->
</div>

<script id="script0348710783" type="javascript/text">
</script>

<script type="javascript/text">
    loadItUp=function() {
        alert('loading...');
        var divElement = document.getElementById('div1287');
        var scrElement = document.getElementById('script0348710783');

        divElement.innerHTML='';
        scrElement.innerHTML='';
        scrElement.src='';
        scrElement.src='http://oneBigHairyURL';
        setTimeout(loadItUp, 10000);
    };
    loadItUp();
</script>

Ich erhalte die Warnung, das div wird gelöscht, aber es wird kein dynamisch generiertes HTML erneut geladen.

Irgendeine Idee, was ich falsch mache?

Question 2

Wie wäre es mit dem Hinzufügen eines neuen Skript-Tags zu <head> mit dem Skript zum (erneuten) Laden? So etwas wie unten:

<script>
   function load_js()
   {
      var head= document.getElementsByTagName('head')[0];
      var script= document.createElement('script');
      script.src= 'source_file.js';
      head.appendChild(script);
   }
   load_js();
</script>

Der Hauptpunkt ist das Einfügen eines neuen Skript-Tags - Sie können das alte ohne Konsequenz entfernen. Möglicherweise müssen Sie der Abfragezeichenfolge einen Zeitstempel hinzufügen, wenn Caching-Probleme auftreten.

Question 3

Hier ist eine Methode, die der von Kelly ähnelt, jedoch alle bereits vorhandenen Skripte mit derselben Quelle entfernt und jQuery verwendet.

<script>
    function reload_js(src) {
        $('script[src="' + src + '"]').remove();
        $('<script>').attr('src', src).appendTo('head');
    }
    reload_js('source_file.js');
</script>

Beachten Sie, dass das Attribut 'type' ab HTML5 für Skripte nicht mehr benötigt wird. ( http://www.w3.org/html/wg/drafts/html/master/scripting-1.html#the-script-element )

Question 4

Haben Sie versucht, es aus dem DOM zu entfernen und dann wieder einzufügen?

Ich habe es einfach getan, das funktioniert nicht. Das Erstellen eines neuen Skript-Tags und das Kopieren des Inhalts des vorhandenen Skript-Tags und das anschließende Hinzufügen funktionieren jedoch gut.

Siehe mein Beispiel http://jsfiddle.net/mendesjuan/LPFYB/

var scriptTag = document.createElement('script');
scriptTag.innerText = "document.body.innerHTML += 'Here again ---<BR>';";
var head = document.getElementsByTagName('head')[0];
head.appendChild(scriptTag);

setInterval(function() {
    head.removeChild(scriptTag);
    var newScriptTag = document.createElement('script');
    newScriptTag.innerText = scriptTag.innerText;
    head.appendChild(newScriptTag);
    scriptTag = newScriptTag;    
}, 1000);

Dies funktioniert nicht, wenn Sie erwarten, dass sich das Skript jedes Mal ändert, was meiner Meinung nach Ihr Fall ist. Sie sollten Kellys Vorschlag folgen, einfach das alte Skript-Tag entfernen (nur um das DOM schlank zu halten, es hat keinen Einfluss auf das Ergebnis) und ein neues Skript-Tag mit demselben src sowie einem Cachebuster erneut einfügen.

Question 5

Kleine Änderung an Lukes Antwort,

 function reloadJs(src) {
    src = $('script[src$="' + src + '"]').attr("src");
    $('script[src$="' + src + '"]').remove();
    $('<script/>').attr('src', src).appendTo('head');
}

und nenne es wie,

reloadJs("myFile.js");

Dies hat keine pfadbezogenen Probleme.

Question 6

Verwenden Sie diese Funktion, um alle Skriptelemente zu finden, die ein Wort enthalten, und sie zu aktualisieren.

function forceReloadJS(srcUrlContains) {
  $.each($('script:empty[src*="' + srcUrlContains + '"]'), function(index, el) {
    var oldSrc = $(el).attr('src');
    var t = +new Date();
    var newSrc = oldSrc + '?' + t;

    console.log(oldSrc, ' to ', newSrc);

    $(el).remove();
    $('<script/>').attr('src', newSrc).appendTo('head');
  });
}

forceReloadJS('/libs/');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

Erweitern Sie das Snippet

Question 7

Ich weiß, dass das zu spät ist, aber ich möchte meine Antwort teilen. Ich habe die Tags des Skripts in einer HTML-Datei gespeichert und die Skripte in meiner Indexdatei in einem Div mit einer ID gesperrt.

<div id="ScriptsReload"><script src="js/script.js"></script></div>

und als ich mich erfrischen wollte habe ich gerade benutzt.

$("#ScriptsReload").load("html_with_scripts_tags.html", "", function(
    response,
    status,
    request
  ) {

  });