2013-11-30 2 views
0

У меня есть следующий код в части моего html и задавался вопросом, как я могу очистить его, чтобы оптимизировать загрузку.Объединение встроенных скриптов в <head>

<script type="text/javascript"> 

function downloadJSAtOnload() { 
var element = document.createElement("script"); 
element.src = "js/jquery.orbit-1.2.3.min.js"; 
document.body.appendChild(element); 
} 

function downloadJSAtOnload() { 
var element = document.createElement("script"); 
element.src = "http://code.jquery.com/jquery-latest.min.js"; 
document.body.appendChild(element); 
} 

if (window.addEventListener) 
window.addEventListener("load", downloadJSAtOnload, false); 
else if (window.attachEvent) 
window.attachEvent("onload", downloadJSAtOnload); 
else window.onload = downloadJSAtOnload; 

</script> 
+1

Обратите внимание, что только одна из функций 'downloadJSAtOnload' будет использоваться (вторая). Также обратите внимание, что с текущими браузерами, если бы вы предоставляли этим функциям разные имена и вызывали их обоих, не было бы никакой гарантии, что jQuery будет загружен до плагина Orbit (что, вероятно, приведет к сбою плагина Orbit). У вас будет состояние гонки. –

+1

Если ваша цель - показать страницу до того, как скрипты будут загружены, есть очень простой способ: просто поместите теги сценария (в соответствующем порядке) в самом конце «тела», перед тем, как закрытие '' тега. –

+0

О, хорошо, вот что я собираюсь. то, что было бы в случае использования и «на событии загрузки», а не поместить его в тег тела? – William

ответ

2

Если ваша цель состоит в том, чтобы страница будет отображаться до загрузки скриптов, есть гораздо простой способ: Просто поместите тег сценария (в соответствующем порядке) в самом конце body , непосредственно перед закрывающим </body> тег:

<!-- ...content of page... --> 
<script src="http://code.jquery.com/jquery-latest.min.js"></script> 
<script src="js/jquery.orbit-1.2.3.min.js"></script> 
</body> 
</html> 

load событие на window объекта происходит очень в конце процесса загрузки страницы, после того, как все остальные ресурсы были полностью ло (или не удалось загрузить). Таким образом, все изображения, как на переднем плане, так и на заднем плане и т. Д.

Поместив скрипты прямо в конец тела, вы получите их в очереди загрузки браузера в разумные сроки, но не заставляя браузер ждать сценария перед выполнением первоначальной рендеринга страницы. Вы также получите заказ (вы получите это с атрибутом defer на элементе script, но не все браузеры его поддерживают). Подробнее: YUI Best Practices for Speeding Up your Website

Вы запросили в комментариях, когда вы использовали событие load для загрузки скриптов. Мой ответ: у меня никогда не было причин для этого.

+0

, который решает мою проблему загрузки контента сначала, но теперь слайд-шоу, которое у меня есть на моем веб-сайте, совсем не загружается? www.unifiedforuganda.com – William

+0

Я понял это ... спасибо! – William

Смежные вопросы