Как стать автором
Обновить

Не гони коней!

Время на прочтение2 мин
Количество просмотров1.6K
Для построения дерева DOM браузеру при загрузке страницы требуется время. Это нужно учитывать при подгрузке контента на страницу с помощью Ajax.
Собственно к чему это я ...
При разработке последнего проекта я взял на себя задачу организовать подгрузку контента на страницу с помощью Ajax. XMLHTTP-соединение успешно устанавливалось, я получал необходимый контент и с помощью innerHTML вставлял его в скрытый блок на странице, чтобы уже оттуда выдергивать необходимые части. И тут я наткнулся на грабли: в ответ на мои запросы getElementById или getElementsByTagName браузер выдавал undefined вместо необходимых мне подгруженных элементов.

Как оказалось, грабли таились в том, что я слишком торопился: с момента вставки полученного контента на страницу и до момента обращения к его элементам браузер не успевал добавлять новые элементы в DOM-дерево страницы. Решение: задать таймаут, тем самым дать браузеру время для построения дерева DOM. А если мы поместим в конец загружаемого контента узел-метку (например, пустой div с id='flag'), то сможем определить закончил браузер свою работу, или нам нужно еще немного подождать.
var hiddenDiv; // скрытый контейнер на странице
var oXmlHttp = createXmlHttp();
oXmlHttp.open("get", url, true);
oXmlHttp.onreadystatechange = function ()
{
if (oXmlHttp.readyState == 4)
{
if (oXmlHttp.status == 200)
{
hiddenDiv.innerHTML = oXmlHttp.responseText;
var t = setTimeout("handle()", 100);
}
}
}
oXmlHttp.send(null);

function handle()
{
if (document.getElementById('flag') != undefined)
{
// Дерево DOM готово, можем разбирать полученный контент по частям
}
else
{
var t = setTimeout("handle()", 100);
}
}

В зависимости от размера получаемого контента следует установить нужный таймаут.

Оригинал статьи
Теги:
Хабы:
Всего голосов 40: ↑27 и ↓13+14
Комментарии52

Публикации

Истории

Ближайшие события

11 – 13 февраля
Epic Telegram Conference
Онлайн
27 марта
Deckhouse Conf 2025
Москва
25 – 26 апреля
IT-конференция Merge Tatarstan 2025
Казань