Динамическая загрузка файла JS с использованием Prototype?

Question

Я использую прототип для динамической загрузки внешнего js-файла (на самом деле это php-файл). Как это:

function UpdateJS(file)
{
  var url    = 'main_js.php?file='+file;
  var myAjax = new Ajax.Request( url, {method: 'get', onComplete: showResponseHeader} );
}
function showResponseHeader (originalRequest) 
{
  $('jscode').innerHTML = originalRequest.responseText;
}

Контейнер "jscode" определяется следующим образом:

<script type="text/javascript" id="jscode"></script>

И это работает! Но если вызывается какой-то другой файл, все функции из предыдущего сохраняются. И я не хочу этого. Кто-нибудь знает, как «выгрузить» первый файл js при вызове второго?

(я также пытался использовать функцию Ajax.Updater, но результат тот же.)

Обновление: Оказывается, есть большая проблема: она загружается, только если функция «UpdateJS» находится в window.onload, поэтому после этого она ничего не загружает Таким образом, обновление прототипов, возможно, не очень хороший способ для этого ...

Answer 1

Здесь есть отличное руководство по динамической выгрузке Javascript и CSS:

http://www.javascriptkit.com/javatutors/loadjavascriptcss2.shtml

Приведенный ниже код заимствован из приведенной выше ссылки, это чисто решение JS, а не Prototype JS, но оно должно сработать:

function removejscssfile(filename, filetype){
 var targetelement=(filetype=="js")? "script" : (filetype=="css")? "link" : "none" //determine element type to create nodelist from
 var targetattr=(filetype=="js")? "src" : (filetype=="css")? "href" : "none" //determine corresponding attribute to test for
 var allsuspects=document.getElementsByTagName(targetelement)
 for (var i=allsuspects.length; i>=0; i--){ //search backwards within nodelist for matching elements to remove
  if (allsuspects[i] && allsuspects[i].getAttribute(targetattr)!=null && allsuspects[i].getAttribute(targetattr).indexOf(filename)!=-1)
   allsuspects[i].parentNode.removeChild(allsuspects[i]) //remove element by calling parentNode.removeChild()
 }
}

removejscssfile("somescript.js", "js") //remove all occurences of "somescript.js" on page
removejscssfile("somestyle.css", "css") //remove all occurences "somestyle.css" on page

Если вам не нужна функция удаления CSS, я уверен, что вы можете ее взломать.

Answer 2

Я не думаю, что вы можете выгрузить набор свойств, определенных в области видимости файла. Обходной путь должен был бы определить функции, содержащиеся в каждом файле в центральном объекте, который вы удаляете (или переопределяете) всякий раз, когда хотите избавиться от него.

Answer 3

Попробуйте следующее:

function UpdateJS(file)
{
  $('jscode').innerHTML = '';  /*YOU NEED TO RESET THIS*/
  var url    = 'main.js'; /*YOU CAN USE A JAVASCRIPT FILE*/
  var myAjax = new Ajax.Request( url, {method: 'get', onComplete: showResponseHeader} );
}
function showResponseHeader (originalRequest) 
{
  $('jscode').innerHTML = originalRequest.responseText;
}