Как принудительно перезагрузить и перезапустить сценарий?

Question

У меня есть страница, загружающая скрипт с третьей стороны (лента новостей). URL-адрес src для сценария назначается динамически при загрузке (на сторонний код).

<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 (Ид «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> 

Я получаю предупреждение, то ДИВ очищает, но не динамически не генерируется HTML перезагружается к нему.

Любая идея, что я делаю неправильно?

Answer 1

Как насчет добавления нового тега сценария в < head> со сценарием для загрузки? Что-то вроде ниже:

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

Главное вставить новый тег скрипта - вы можете удалить старый без последствий. Возможно, вам потребуется добавить временную метку к строке запроса, если у вас есть проблемы с кешированием.

Answer 2

Вы пытались удалить его из 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, а также с кешью.

Answer 3

Вот такой метод, который похож на Kelly, но удалит любой существующий скрипт с тем же источником и использует 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)

Answer 4

Маленький твик для ответа Луки,

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

и назвать его, как,

relaodJs("myFile.js"); 

Это не будет иметь никаких проблем, связанных с пути.