Получить содержимое HTML-элемента после того, как изменяется JQuery

Question

У меня есть Div

<div id="test" class="test">From 0 to 0</div> 

Тогда есть функция, которая заменяет содержимое DIV

function divChange(aArg) 
{ 

var sText = "From" + aArg[0] + "to" + aArg[1]; 


$("#test").html(sText); 
} 

И я не имею никакого контроля над этой функцией или html. Могу ли я каким-то образом получить текст div после его изменения с помощью javascript (я запускаю greasemonkey над сайтом). Обратите внимание, что содержимое div может быть другим или таким же, как и до изменения.

Обновление: Извините, что забыл что-то упомянуть. Сначала я начинаю поиск, тогда будет запущена асинхронная функция, после получения всех данных (время зависит от используемой базы данных), тогда она будет вызывать это. Поэтому я хочу получать данные после того, как div будет изменен сразу после поиска, иначе результат будет неправильным.

Простая логика: 1. Я начинаю вызывать функцию, у меня нет контроля над 2. Она будет запущена в неизвестное время. 3. После его завершения он вызывается функцией для изменения содержимого div. 4. Я хочу захватить контент в данный момент.

Answer 1

Вы можете просто позвонить снова

$("#test").html(); 

Answer 2

Вы должны быть в состоянии получить содержимое DIV с помощью getElementById с innerHTML или InnerText например,

document.getElementById('test').innerHTML; 
 
//or 
 
document.getElementById('test').innerText;

Разница между двумя объясняется here. Я бы рекомендовал использовать innerHTML, а не innerText, хотя, если у вас нет контроля над тем, какие браузеры используют ваши пользователи, поскольку innerHTML совместим с W3C.

Answer 3

Вы можете использовать

var $content = $("#text"); 

в переменной $ содержимого вы можете получить доступ к любому свойству сНу теста.

Answer 4

Самый простой способ будет постоянно опрос:

var lastValue; 
setInterval(function() { 
    var curValue = $('#test').html(); 
    if(lastValue !== curValue) { 
    lastValue = curValue; 
    // Do whatever it is you want to do with the new value here. 
    } 
}); 

Лучший способ, предполагая, что эта функция вызывается в некотором роде асинхронной функции поиска где-то, было бы заменить какую-либо функцию в цепи с расширенная версия сама по себе:

oldDivChange = divChange; 
divChange = function(aArgs, callback) { 
    oldDivChange(aArgs); 

    var newValue = $('#test').html(); 
    callback(newValue); 
}; 

Answer 5

Если вы не имеете никакого контроля над функцией «divChange», то вы ограничены в том, что вы можете сделать, но есть работа вокруг. Если вы имели контроль над этой функцией вы могли испускать пользовательское событие, когда изменяется содержание и слушать его в своем коде, но видели, как вы не можете сделать, что вам нужно будет попробовать что-то вроде этого:

var text = $('#test').text(), 
    intervalId = setInterval(function(){ 
     var newText = $('#test').text(); 

     if (newText !== text){ 
      // do something with the new value and make sure you clear the interval 
      clearInterval(intervalId); 
     } 
    }, 500); 

Answer 6

Вы должны иметь возможность использовать объект MutationObserver, например:

// select the target node 
var target = document.querySelector('#test'); 

// create an observer instance 
var observer = new MutationObserver(function(mutations) { 
    mutations.forEach(function(mutation) { 

     // output the new contents of the element to browser console 
     if(mutation.type === 'characterData') { 
      console.log(mutation.target); 
     } else { 
      console.log(mutation.target.innerHTML); 
     } 
    });  
}); 

// configuration of the observer: 
var config = { childList: true, characterData: true }; 

// pass in the target node, as well as the observer options 
observer.observe(target, config);