appendChild до того, как узел будет загружен? - PullRequest
0 голосов
/ 19 марта 2011

Можно ли добавить элемент <script> в HEAD до полной загрузки самого HEAD?

Пример:

<head>
<script src="my.js">
//etc

в my.js есть:

var thescript = document.createElement('script');
thescript.setAttribute('type','text/javascript');
thescript.setAttribute('src','otherfile.js');
document.getElementsByTagName('head')[0].appendChild(thescript);

этот код будет выполнен до того, как браузер достигнет </head>

это безопасно или может вызвать проблемы? Я хочу сделать это, потому что я хочу загрузить jquery из моего скрипта .js, поэтому мне не нужно редактировать свои страницы, чтобы добавить другие <script> вручную

Большое спасибо

Ответы [ 3 ]

0 голосов
/ 19 марта 2011

Элемент head будет недоступен до полной загрузки.Однако вы можете использовать другой подход:

Включить только один файл, который называется «includes.js».Это должно выглядеть так:

function include_once(src) {
  // get script elements already in the HTML source code,
  // abort if script has been loaded
  var scripts = document.getElementsByTagName('script');
  if ( scripts ) {
    for ( var k=0; k < scripts.length; k++) {
      if ( scripts[k].src == src ) return; 
    }
  }
  // include if not already loaded
  var script = document.createElement('script');
  script.src = src;
  script.type = 'text/javascript';
  (document.getElementsByTagName('head')[0] || document.body).appendChild(script);
}

// add all your scripts here
function addIncludes () {
    include_once ( 'js/my.js' );
}

Затем вызовите addIncludes onload:

<body onload="addIncludes()">

(Этот пример был взят и изменен с немецкого сайта .)

Если у вас есть JS, который должен выполняться сразу после загрузки, вам нужно установить интервал и проверить наличие дополнительных файлов .js - помните, что они загружаются после , оригинальная страницаполный.

0 голосов
/ 19 марта 2011

В общем случае модифицировать DOM на данном этапе загрузки страницы небезопасно, но document.writeln (''); должно быть хорошо.

0 голосов
/ 19 марта 2011

Это почти то же, что и код асинхронного отслеживания Google Analytics, и он обычно не сталкивается с проблемами.Используя технику, аналогичную GA, это может выглядеть следующим образом:

(function() {
   var thescript = document.createElement('script');
   thescript.type = 'text/javascript';
   thescript.src = 'otherfile.js';
   var s = document.getElementsByTagName('script')[0]; 
   s.parentNode.insertBefore(thescript, s);
})();

Однако помните, что код внутри «otherfile.js» может быть недоступен сразу, поэтому вам необходимо принять это во внимание.GA использует очередь, в которую вы можете добавить вызовы функций, которые будут выполняться, когда скрипт станет доступен.

...