每秒刷新JS脚本值

Question

I have a script which is a getting value "average" from JSON array

<p id="ticker"></p>


<script>
  var xmlhttp = new XMLHttpRequest();
  xmlhttp.onreadystatechange = function () {
  myObj = JSON.parse(this.responseText);
  document.getElementById("ticker").innerHTML = myObj.average; };
  xmlhttp.open("GET", "https://bitbay.net/API/Public/BTC/ticker.json", true);
  xmlhttp.send();
</script>

My problem is making this <p> refresh every some seconds. I wasted all day to do this. Could you please help me with it?

Answer 1

Can you do this:

<script>
window.setInterval(function(){
  var xmlhttp = new XMLHttpRequest();
  xmlhttp.onreadystatechange = function () {
  myObj = JSON.parse(this.responseText);
  document.getElementById("ticker").innerHTML = myObj.average; };
  xmlhttp.open("GET", "https://bitbay.net/API/Public/BTC/ticker.json", true);
  xmlhttp.send();
}, 1000);
</script>

This runs your "function" every second (1000 milliseconds). I advice you to throw this into another function making it more like:

<script>
window.setInterval(updateTicker(), 1000);

function updateTicker(){
    var xmlhttp = new XMLHttpRequest();
    xmlhttp.onreadystatechange = function () {
        myObj = JSON.parse(this.responseText);
        document.getElementById("ticker").innerHTML = myObj.average; 
    };
    xmlhttp.open("GET", "https://bitbay.net/API/Public/BTC/ticker.json", true);
    xmlhttp.send();
}
</script>

Answer 2

Simply use setInterval(()=>{//code }, time) to repeat getting the JSON.

 setInterval(getAvg, 5*1000); // every 5 seconds function getAvg() { var xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function () { myObj = JSON.parse(this.responseText); document.getElementById("ticker").innerHTML = myObj.average; }; xmlhttp.open("GET", "https://bitbay.net/API/Public/BTC/ticker.json", true); xmlhttp.send(); } 

 <p id="ticker"></p> 

Answer 3

A simple setInterval should do the trick.

<p id="ticker"></p>

<script>  
  var ticker = document.getElementById("ticker");  // Cache that (faster)

  function updateP(){
     //... Do whatever
     ticker.innerHTML = "..."
  }

  updateP(); // Update once immediately...
  setInterval(updateP, 3000) // ...and then again every 3000ms
</script>

Answer 4

You can use setInterval() (which calls a function or evaluates an expression at specified intervals in milliseconds) to achieve this:

 function getValue(){ var xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function () { if (xmlhttp.readyState==4 && xmlhttp.status==200){ var myObj = JSON.parse(this.responseText); document.getElementById("ticker").innerHTML = myObj.average; } }; xmlhttp.open("GET", "https://bitbay.net/API/Public/BTC/ticker.json", true); xmlhttp.send(); } setInterval(getValue, 1000); 

 <p id="ticker"></p> 

UPDATE: to fix the parse exception we should process the response only if the request was successful .

Answer 5

<p>Click the button to wait 3 seconds, then alert "Hello".</p>
<p id="text">After clicking text will change here and count starts for every 0.5 seconds. This goes on forever...</p>
<button onclick="myFunction()">Try it</button>

<script>
var i=0;
function myFunction() {

    setInterval(function(){ document.getElementById('text').innerHTML = i++; }, 500);
}
</script>

</body>
</html>