Использование jQuery в данных ответа AJAX

Question

Я ищу, чтобы использовать jQuery, чтобы определить, изменилась ли текущая страница вверх по течению, и если да, выполните некоторые действия.

Я хочу сделать это с помощью селекторов jQuery по данным, возвращаемым вызовом AJAX (для целей этого вопроса моя «страница изменилась», метрика будет «имеет значение первого <h1> изменено»).

Таким образом, я нахожу, что хочу использовать селектор jQuery по HTML, возвращаемый AJAX get(). «Лучший» «решение» я нашел до сих пор является добавление данных в какой-то скрытый DIV, и с помощью селектора над этим, как показано ниже:

var old_title = $('h1').html(); 

$.get(url, function(data) { 
    $('#hidden_temporary_storage').append(data); 
    var new_title = $('#hidden_temporary_storage h1').html(); 
    if (new_title !== old_title) { 
     do_something(); 
    } 
}); 

Это чувствует себя так очень неправильно - я бы вложенности html/head/body, и там будут столкновения id и так далее.

У меня нет контроля над восходящей страницей, поэтому я не могу просто «получить данные в более удобном формате», увы.

Answer 1

Вы можете сделать:

var x = $('<div>'+data+'</div>').find('h1').html(); 
// use x as you like 

то вам не нужно добавлять возвращаемых данных на страницу, чтобы быть в состоянии получить свойства и значение из HTML-элементов, определенных в нем. Таким образом, не было бы никаких коллизий id, нескольких тегов заголовка/тела и т. Д.

Answer 2

Я думаю, что лучше всего использовать iFrame. И затем используйте jQuery для содержимого этого iFrame.

var old_title = $('h1').html(); 

$.get(url, function(data) { 
    $('<iframe id="tmpContent"></iframe>').appendTo("html"); 
    $('#tmpContent').contents().find('html').html(data); 
    var new_title = $('#tmpContent').contents().find('h1').html(); 
    if (new_title !== old_title) { 
     do_something(); 
    } 
    $('#tmpContent').remove(); 
});