Comment déclencher un événement lorsque cette valeur de plage change?

Question

J'essaie d'obtenir un journal de la console lorsque le prix du stock de la page en cours change.

page: https://www.google.com/finance?q=NASDAQ%3AGOOG&ei=yvbRVbHSCcKgmAGyu7CoDA

ID d'élément: # panneau de prix> div> span> durée

Tentative 1:échec

$("#price-panel div span span").onchange = function() { console.log('change')} 

Tentative 2:échec

document.getElementById('price-panel').children[0].children[0].onchange = function() { console.log('change')} 

builtwith.com dit le javascript est le "google api" qui est ambigu à google recherche ce qui n'a pas aidé beaucoup.

Quel événement puis-je regarder pour savoir quand cet élément est le changement?

Answer 1

span éléments ne sont pas un événement onchange. Une chose que vous pouvez faire est d'introduire une boucle de vérifier périodiquement le contenu actuel avec un contenu précédemment détenu et faire quelque chose si les deux sont différents:

var content = null, 
    $element = $("#price-panel div span span"); 

setInterval(function() { 
    var currentText = $element.text(); 

    if (currentText != content) { 
     // A change has happened 
     console.log("Change"); 
     content = currentText; 
    } 
}, 30000 /* check every 30 seconds */); 

Answer 2

De Dom Events comme essayer d'écouter le texte des changements dans <span> vous pouvez être capable d'utiliser DOMCharacterDataModified.

Ou vous pouvez utiliser MutationObserver pour capturer les changements.

var span = document.querySelector('#test'); 
 
var text = document.createTextNode('tttt'); 
 

 
// This may be deprecated. 
 
span.addEventListener('DOMCharacterDataModified', function() { 
 
    alert('span text changed to: ' + this.innerHTML); 
 
}); 
 

 
// You may use MutationObserver instead. 
 
var mutateObserver = new MutationObserver(function(records) { 
 
    console.log(records); 
 
}); 
 
mutateObserver.observe(span, { 
 
    childList: true,         // capture child add/remove on target element. 
 
    characterData: true,      // capture text changes on target element 
 
    subtree: true,         // capture childs changes too 
 
    characterDataOldValue: true // keep of prev value 
 
}); 
 

 
setTimeout(function() { 
 
    span.innerHTML ='SSSS'; 
 
}, 2000); 
 

 
setTimeout(function() { 
 
    span.appendChild(text); 
 
}, 3000); 
 

 
setTimeout(function() { 
 
    text.data = '3123'; 
 
}, 4000);

<span id="test">This is a span</span>