Изменение динамического содержимого в jQuery без функции обратного вызова

Question

Я давно искал хороший ответ на этот вопрос и, похоже, не нашел консенсуса относительно простого способа сделать это. Также кажется, что многие предыдущие способы устарели.

В основном, используя платформу HubSpot, я создаю пользовательскую страницу. На этой странице есть раздел, который динамически добавляется. Поскольку нет функции обратного вызова, которую я могу использовать, и .load() или .ready(), похоже, не работают для динамического содержимого. Как я могу захватить эти элементы DOM, которые занимают пару секунд для загрузки?

Answer 1

.load и .ready wait DOM для загрузки. Это будет сырой вывод html на сервере, что означает, что любое загруженное содержимое динамически не будет существовать и, следовательно, не может быть обработано.

Самый простой способ - использовать JQuery .ajaxComplete() и прикрепить его к документу.

В основном, это стало бы что-то вроде:

$(document).ajaxComplete(function() { /* Do Stuff */ }); 

Недостатком является то, что это будет срабатывать, когда завершается ANY Аякса вызов, а не только один вы после так, если это функция медленной обработки, это будет чтобы ваша страница сильно отстала.

Лучше всего использовать это вместе с условными операторами, чтобы увидеть, были ли загружены данные, которые вы хотели манипулировать. Например. если вы хотите изменить элемент с классом «Foo», как только он будет загружен, вы могли бы сделать что-то вроде:

$(document).ajaxComplete(function() { if($('.foo').length) { /* Element exists since length is greater than 0, do stuff */ }); 

Это по-прежнему будет стрелять каждый АЯКС вызов, но по крайней мере, таким образом, это не будет вызывать ваша страница слишком сильно отстает, так как условный оператор будет терпеть неудачу, пока документ не будет загружен.

Кроме того, в зависимости от того, что вы хотите сделать с элементами, вы можете добавить какой-либо способ проверки, если он был обработан (например, путем создания логической переменной, проверьте значение, когда вы видите, существует ли этот элемент, и затем измените его после внесения изменений).