スクリプトの再読み込みを強制して再実行するには？

Question

私は第三者からスクリプトを読み込んでいるページを持っています（ニュースフィード）。スクリプトのURLは、ロードアップ時（サードパーティコードごとに）に動的に割り当てられます（src）。 （同上「div1287は」http://oneBigHairyURLに渡され

<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になど、かなりの書式設定で、ニュースフィードから様々なものを持つ要素を作成し、負荷のどこに非常にスクリプトが知っていますコンテンツを読み込みます）。

唯一の問題は、一度だけロードすることです。私はそれをリロードして新しいコンテンツを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は、それにリロードされません。

私が間違っていることを知っていますか？

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

私の例を参照してください。 Kellyの提案に従ってください。古いスクリプトタグを削除するだけで（DOMをスリムに保ち、結果には影響しません）、同じsrcを持つ新しいスクリプトタグとキャッシュバスターを再挿入してください。

Answer 3

ここでは、Kelly'sに似ていますが、同じソースで既存のスクリプトを削除し、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"); 

これは、任意のパスに関連する問題を持っていません。