2008-06-05

onReady

Сегодня клиенты пожаловались что если что нибудь на странице не загрузилось то не работатет часть JavaScript'овского функционала - конкретно у них не сработала загрузка видео с ютуба - чето последнее время у них не быстро там все работает. Просто основная логика на странице подключается с использованием события onLoad - в принципе штука не обязательная в человечьих браузерах, но вот в Эксплорере при попытки поменять что либо до этого события возникает очень плохая ошибка.

Беда в том что onLoad возникает когда все изображения и все связные документы подгружены и если например одно из изображения подгружается с другого сервера, который умер, то ждать этого события придется довольно долго иногда несколько минут, и были случаи что событие так и не наступало...

Оказывается вносить изменения в объектную модель браузера можно и до возникновения события onLoad, т.е. когда не все изображения еще подгружены

ниже привожу функцию для отслеживания момента когда в браузере становится возможным вносить изменения в объектную модель документа. Идея позаимствована из JQuery

/** * faster way to load content in browser idea taken frin JQuery * this allows do not wait until data will be completely loaded * seems only opera can allow load faster using this function - * though in JQuery they say it's supported... */ //alert(document.addEventListener); function bindReady(){ if ( bindReady.readyBound ) return; bindReady.readyBound = true; if (document.addEventListener){ document.addEventListener( "DOMContentLoaded", bindReady.ready, false ); } // Mozilla, Opera (see further below for it) and webkit nightlies currently support this event // If IE is used and is not in a frame // Continually check to see if the document is ready if ( Object.isIE && window == top ) (function(){ if (bindReady.isReady) return; try { // If IE is used, use the trick by Diego Perini // http://javascript.nwbox.com/IEContentLoaded/ document.documentElement.doScroll("left"); } catch( error ) { setTimeout( arguments.callee, 0 ); return; } // and execute any waiting functions bindReady.ready(); })(); if ( Object.isSafari || Object.isOpera ) { var numStyles; (function(){ if (bindReady.isReady) return; if ( document.readyState != "loaded" && document.readyState != "complete" ) { setTimeout( arguments.callee, 0 ); return; } bindReady.ready(); })(); } } bindReady.readyBound = false; bindReady.isReady = false; bindReady.ready = function(){ bindReady.isReady = true; var i; for (i=0;i

Тестировал в IE6/IE7, Safari, Opera, FF. Не нравится только как работает в Опере - там скрипт срабатывает позже onLoad, в остальных браузерах гораздо раньше

 

комментарии:

 

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

Имя*

разрешены только теги br, font, span, p, strong, u, p, blockquote, a, div, img - остальные будут безжалостно удаляться