Выполнение динамически введенных <SCRIPT>не работает в Firefox (47.0)

Question

У меня есть HTML-фрагмент, возвращенный из вызова AJAX в форме

<SCRIPT src="..."  type="text/javascript"></SCRIPT>
<SCRIPT type="text/javascript">
 function showForumGrid()
 { ... };
 function f()
 { ...}
</SCRIPT>
<DIV id="div1">
 ...
  <IMG id="dummyBody" src="..." onload="showForumGrid()">
</DIV>

В обработчике вызовов AJAX я делаю следующее

var x=document.getElementById(snippet_container_id);

//$(x).html(ajaxData);

var domFragment = $.parseHTML($.trim(ajaxData),document,true);
$(x).empty();
$(x).prepend(domFragment);  

Это работает нормально в Chrome, но в Firefox я получаю ошибку ReferenceError: showForumGrid не определена

Answer 1

Это потому, что когда вы добавляете <script> узлы в документе, после того, как документ был проанализирован, они не обрабатываются как синхронные, как это было раньше.
_{(даже настройка} async _{атрибут не работает)}.

Вот упрощенный пример:

var external = document.createElement('script');
var inner = external.cloneNode();
external.src = 'data:application/javascript,console.log("external")';
inner.innerHTML = 'console.log("inner")';

document.head.appendChild(external);
document.head.appendChild(inner);

Не уверен, что вы можете сделать что-то еще, кроме ожидания load событие _{(IE9+ браузеры)} внешнего <script> или установить цикл проверки, если showForumGrid определяется _{(если вам нужна поддержка старых браузеров)}.

var external = document.createElement('script');
var inner = external.cloneNode();
external.onload = function() {
  document.head.appendChild(inner)
}
external.src = 'data:application/javascript,console.log("external")';
inner.innerHTML = 'console.log("inner")';
document.head.appendChild(external)