Экземпляр window.onload после изменения DOM?

При первой загрузке страницы мы можем использовать window.onload, чтобы убедиться, что все ресурсы загружены до того, как мы что-то сделаем.Экземпляр window.onload после изменения DOM?

На мой вопрос, , если мы модифицируем DOM (например, вставим некоторый html на основе запроса ajax), есть ли какое-либо событие, которое будет срабатывать, когда документ снова находится в состоянии «загружено»? (например, когда вставленный html содержит несколько изображений).

(Решение с jQuery будет в порядке).

источник

2013-03-29 UpTheCreek

@Felix - Я не хочу, чтобы обнаружить изменения в DOM , Я хочу определить, когда ресурсы были загружены после изменения DOM. Все эти вопросы, о которых вы говорите, касаются обнаружения изменений. – UpTheCreek

Возможно, вам следует явно указать это. DOM, готовый и все загружаемые ресурсы, - это две разные вещи. –

Просто, чтобы уточнить, поскольку вы, кажется, не делаете различий между загрузкой и готовностью, в jQuery .load() происходит, когда страница полностью визуализируется, а .ready() происходит, как только создается иерархия DOM. Если ваш код зависит от загруженных активов (например, вам нужно получить размеры изображения), вы должны использовать .load(), чтобы убедиться, что ваш код выполняется, когда доступны все необходимые активы. В противном случае вы можете использовать .ready() для ускорения работы, так как ваш код будет выполняться при рендеринге. – excentris

Короткий ответ: NO.

Длинный ответ: Если вы знаете, что ищете, вы можете использовать наблюдателей за мутацией (https://developer.mozilla.org/en-US/docs/DOM/MutationObserver). это только поддержка в новом браузере, а в некоторых версиях хром он имеет утечки памяти при использовании с закрытием.

BTW, document.ready не сообщает вам, загружены ли все (или любые другие) ресурсы. он только говорит вам хорошо, что дом готов (это функция загрузки, которая будет запускаться только после всех ресурсов (ну, любые ресурсы, которые не запрашиваются с помощью javascript) были загружены).

источник

2013-03-29 09:56:29

Вы можете использовать .done().

Описание: Добавить обработчики будут вызываться, когда Отложенный объект решен.

Также есть JQuery плагин See Here

источник

2013-03-29 09:56:46

Не уверен, что я следую Дипешу. Я могу приложить сделанное обещание от вызова ajax, но это будет говорить только тогда, когда у меня есть данные, а не о каких-либо ресурсах, которые начали загружаться после того, как я вставляю их в DOM. Или вы имеете в виду что-то еще? – UpTheCreek

Я бы сказал ДА (я не знаю, если это поддерживается всеми браузерами. Я использую его в сафари и хром)

TestCase вы можете найти здесь : http://maakmenietgek.nl/testcases/domready/ Пожалуйста, обратите внимание, что я не могу заставить его работать в скрипку, поэтому автономный TestCase

index.html выглядит следующим образом

<!DOCTYPE html> 
<head> 
    <title>Testcase</title> 
    <script src="jquery-1.8.2.js" type="text/javascript" charset="utf-8"></script> 
    <script type="text/javascript"> 
    $(document).ready(function() { 
     $('#clickme').click(function() { 
     $.get('ajaxdata.html', function(data) { 
      $('#addhere').html(data); 
     }); 
     }); 
    }) 
    </script> 
</head> 
<body> 
    <p id="clickme">clickme</p> 
    <div id="addhere"> 
    </div> 
</body> 
</html>

Данные, загруженные с $.get вызова выглядит следующим образом

<p>added data</p> 
<script type="text/javascript"> 
    $(document).ready(function() { 
     alert('added data'); 
    }); 
</script>

Оповещение показывает после того, как HTML был добавлен в DOM

источник

2013-03-29 10:18:10

Экземпляр window.onload после изменения DOM?

ответ

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