1. ホーム
  2. javascript

[解決済み] スクリプトを強制的に再読み込み、再実行するには?

2023-01-13 05:14:20

質問

第三者からのスクリプトを読み込んでいるページがあります(ニュースフィード)。そのページには src の url は、ロード時に動的に割り当てられます (サードパーティのコードによる)。

<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はそこに再ロードされません。

何か間違ったことをしているのでしょうか?

どのように解決するのですか?

head>に新しいscriptタグを追加して、スクリプトを(再)読み込ませるのはどうでしょうか?以下のようなものです。

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

主なポイントは新しいスクリプトタグを挿入することであり、古いものを削除しても影響はありません。 キャッシュの問題がある場合は、クエリ文字列にタイムスタンプを追加する必要があるかもしれません。