AJax не успевает прогрузить страницу, как исправить?

Question

[lilikon]

Есть html код:
Тест



Загрузка данных ...


Есть ajax скрипт:
function showContent(link) {
var cont = document.getElementById('contentBody');
var loading = document.getElementById('loading');
cont.innerHTML = loading.innerHTML;
var http = createRequestObject();
if( http ) {
http.open('GET', link);
http.onreadystatechange = function () {
if(http.readyState == 4 ) {
cont.innerHTML = http.responseText;
}
}
http.send(null);
} else {
document.location = link;
}
}
// создание ajax объекта
function createRequestObject() {
try { return new XMLHttpRequest() }
catch(e) {
try { return new ActiveXObject('Msxml2.XMLHTTP') }
catch(e) {
try { return new ActiveXObject('Microsoft.XMLHTTP') }
catch(e) { return null; }
}
}
}

Есть подгружаемый файл с кодом и подключением css:

тест
_______________________________________________________________
Загрузка страницы работает прекрасно, НО стили прогружаются как бы с задержкой.
Страница уже загрузилась, а стиль еще не совсем, и видно что на странице вначале старый стиль, а потом включается новый

Как сделать что бы стиль загружался быстрее подгружаемой страницы?

Answer 1

[Александр Аксентьев]

Подключить более быстрый интернет, ну или компьютер обновить.
И заодно узнать как работает http.

Подключать стили заранее, а не во время выполнения когда они УЖЕ нужны.
Еще можно засунуть все стили в <style>.
В общем целую кучу костылей можно придумать.

Comments

[lilikon]

Стили нужны на определенных страницах свои, и прописывать всем дивам ид и классы и потом путаться в 100500 строк css'a как то не удобно. По этому и подключаю нужный стиль на нужной странице что бы не сбить данные. На счет компа и веб сервера, анолично происходит и на хостингах, и дорогих и бесплатных, так что от железа тут нечего не зависит.
и если заносить все в стиль

Answer 2

[Иван]

Вам верно сказали. Подключайте стили в head. Если стили динамические, пусть за это отвечает бэкэнд.
Также есть костылик, когда у вас на весь экран поверх всего fixed div, например с надписью "загрузка ..." По окончанию загрузки он удаляется.

Comments

[lilikon]

"Подключайте стили в head. Если стили динамические, пусть за это отвечает бэкэнд." - можно поподробнее, просто смотрите, у меня есть стили на боди и на дивы у многих стоят одинаковые и ид и классы, я подключал отдельно нужный css на нужной странице и у меня менялся как мне надо фон, стиль кнопок и т.д.

Как можно то же самое описать в хедере, можно один простой пример, что бы определенный css подключался на определенную страницу

Заранее благодарю!