У меня есть эта проблема, когда компоненты пользовательского интерфейса моей страницы, такие как раскрывающиеся меню, доступны до тех пор, пока скрипты третьей стороны не закончат загрузку. Это вызывает проблему, потому что кто знает, что происходит на этих серверах. Мне нужно отделить доступность интерактивных компонентов страницы от загрузки материалов третьей стороны ...Как вы отделите свою страницу от сторонних скриптов?
как?
=/
Попробуйте что-то вроде этого:
<script type="text/javascript">
window.onload = function() {
var scripts = [ '3rdparty1url','3rdparty2url','3rdparty3url',etc...];
var head = document.getElementsByTagName('head')[0];
for(var i = 0; i < scripts.length; ++i) {
var scriptTag = document.createElement('script');
scriptTag.src = scripts[i];
head.appendChild(scriptTag);
}
}
</script>
Это загрузит в ваших внешних файлах сценария после завершения загрузки страницы в браузере клиента. Элементы пользовательского интерфейса формы должны быть доступны.
Если вы используете JQuery, вы можете сделать это:
<script type="text/javascript">
jQuery(function($){
var scripts = [ '3rdparty1url','3rdparty2url','3rdparty3url',etc...];
$.each(scripts, function(i,scrurl) {
$('head').append($('<script>', { src: scrurl }));
}
});
</script>
Вы должны тщательно продумать свою страницу, так что это хорошо разлагаются.
сделать меню, доступное в некоторых «голой» форме перед JS загружается и когда они вы можете изменить пользовательский интерфейс, чтобы быть superfancy и полными наворотов :)
Это также будет полезно для эти пользователи (вероятно, не так много, но все же ...), которые отключили JS, и для индексирования пауков, чтобы поймать содержимое ваших меню.
JS гуру производительности Steve Souders on JavaScript blocking and asynchronous loading дает хороший обзор. Google «асинхронная загрузка javascript» для получения более подробной информации. Есть libraries, которые также могут планировать и загружать внешние файлы. Another.