В Greasemonkey/javascript, как я могу обрабатывать новые элементы, добавленные на страницу?

Question

Я написал Greasemonkey скрипт, который манипулирует содержимое некоторых элементов со следующим селектором:

$("span.relativetime").each(function() { $(this).html("TEST"); }); 

Однако иногда соответствующие элементы добавляются на страницу с помощью AJAX, и я не знаю, как обращаться с теми, новые элементы. Я попытался это, но он не работает:

$("span.relativetime").live(function() { $(this).html("TEST"); }); 

documentation for jQuery live() говорит, что он хочет, чтобы событие (например, «нажмите»). Но у меня нет никакого события, я просто хочу знать, когда было создано что-то, соответствующее моему селектору, и затем я хочу его изменить.

фон: Я встречая эту проблему с помощью Greasemonkey скрипта для отображения относительных временных меток StackOverflow как абсолютные локальные временные метки, которые you can find on meta-SO. Проблема заключается в том, когда вы нажимаете «показать все комментарии», новые комментарии добавляются AJAX, и я не знаю, как находить и заменять метки времени в этих сценариях.

Answer 1

С настройкой StackOverflow я нахожу это раздражающим для обработки материала после комментариев. То, что я сделал, помещает привязку в кнопку добавления/удаления комментариев, которая использует setTimeout для ожидания создания элементов, а затем их изменения.

Answer 2

Одна вещь, которую вы могли бы попробовать (хотя я не уверен, если это будет работать), чтобы кэшировать ваш выбор в некоторой глобальной переменной, как так:

var $relativetime = $("span.relativetime"); 

Тогда вы бы вашу функцию .each:

$relativetime.each(function() { $(this).html("TEST"); }); 

После того, как ваши новые элементы были добавлены к DOM, вы можете повторно добавить к вашему кэшированному объекту:

$relativetime.append("<my html>"); //or 
$("<my html>").appendto($relativetime); 

(P.s. .html() предназначен для установки html. Чтобы установить текст, используйте .text()