petitviolet_blog

@petitviolet blog

javascriptの再読込み

javascriptのリロード

Ajaxで画面の一部を更新したとき、その部分に影響するjQueryプラグインがきちんと動作しなくなることがあったので、
それを改善するためにそのjQuery(js)ファイルを再読込みすることで対処しました。

具体的には

videobox.jsを使っていて、そのvideobox.jsが影響する部分、つまりクリックで動画を再生する部分をAjaxで並び替えることでなぜかvideobox.jsが動作しなくなった。

コード

// 動画の表示を変更してからjsを再読込する
function require(uri) {
  var script  = document.createElement('script');
  script.type = 'text/javascript';
  var now = new Date();
  var hour = now.getHours();
  var min = now.getMinutes();
  var sec = now.getSeconds();
  var temp = hour.toString() + min.toString() + sec.toString()
  script.src  = uri + '?v=' + temp;
  var head    = document.getElementsByTagName('head')[0];
  head.appendChild(script);
}
// require(uri);

やってること

この部分

script.src = uri + '?v=' + temp;

で、キャッシュに残っているjsファイルとは違うファイルであると見せかけて
改めてjsファイルを読み込んでいる。
それをhtmlのheadに付け加えているだけ。
この処理を何回もするとheadがえらいことにw

結果

うまくいくプラグインといかないプラグインがあってわけわからんけど
もし同じ悩みがあるなら一度どうぞ?