Як змусити сценарій перезавантажити та повторно виконати?

Question 1

У мене є сторінка, яка завантажує сценарій від третьої сторони (стрічка новин). srcURL для сценарію призначаються динамічно навантаження до (за код третьої сторони).

<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>

Сценарій, завантажений з http://oneBigHairyURLцього моменту, створює та завантажує елементи з різними матеріалами з div1287стрічки новин, з гарним форматуванням тощо (ID "div1287" передається, http://oneBigHairyURLщоб сценарій знав, куди завантажувати вміст).

Єдина проблема полягає в тому, що він завантажується лише один раз. Я хотів би, щоб він перезавантажувався (і таким чином відображав новий вміст) кожні n секунд.

Отже, я подумав спробувати це:

<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>

Я отримую попередження, div очищається, але жоден динамічно згенерований HTML не перезавантажується до нього.

Будь-яка ідея, що я роблю не так?

Question 2

Як щодо того, щоб додати новий тег сценарію до <head> разом із сценарієм для (повторного) завантаження? Щось як нижче:

<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>

Головне - вставити новий тег сценарію - ви можете видалити старий без наслідків. Можливо, вам доведеться додати мітку часу до рядка запиту, якщо у вас є проблеми з кешуванням.

Question 3

Ось метод, подібний до методу Келлі, але видаляє будь-який вже існуючий сценарій з тим самим джерелом і використовує jQuery.

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

Зверніть увагу, що атрибут 'type' більше не потрібен для сценаріїв, починаючи з HTML5. ( http://www.w3.org/html/wg/drafts/html/master/scripting-1.html#the-script-element )

Question 4

Ви пробували видалити його з DOM, а потім знову вставити назад?

Я щойно зробив, це не працює. Однак створення нового тегу сценарію та копіювання вмісту існуючого тегу сценарію, а потім його додавання працює добре.

Дивіться мій приклад 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);

Це не спрацює, якщо ви очікуєте, що сценарій буде змінюватися щоразу, що, на мою думку, є вашим випадком. Ви повинні слідувати пропозиціям Келлі, просто видаліть старий тег сценарію (лише для того, щоб зберегти DOM в тонкості, це не вплине на результат) і вставте новий тег сценарію з тим самим src, а також кеш-бастером.

Question 5

Невеликий підхід до відповіді Луки,

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

і називати це як,

reloadJs("myFile.js");

Це не матиме жодних проблем, пов’язаних із шляхом.

Question 6

Використовуйте цю функцію, щоб знайти всі елементи сценарію, що містять якесь слово, та оновити їх.

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>

Розгорніть фрагмент

Question 7

Я знаю, що пізно, але хочу поділитися своєю відповіддю. Те, що я зробив, це збереження тегів de script у файлі HTML, блокування скриптів у моєму файлі Index у div з ідентифікатором, приблизно так.

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

і коли я хотів освіжити, я просто використовував.

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

  });