刷新div内容，无需Jquery，AJAX

Question

How do you use just plain JS to refresh the content of the an AJAX inserted div? 您如何仅使用普通JS刷新AJAX插入的div的内容？ So many examples use Jquery but I'm trying to stay light and not use Jquery. 如此多的示例使用Jquery，但我试图保持简洁而不使用Jquery。 What I have so far: 到目前为止，我有：

-index. -指数。 php the html page -livedata. php html页面-livedata。 php html of the section with the live data -scripts. 带有实时数据-scripts部分的php html。 js file with the JS JS的js文件

I want to refresh page every 10 seconds. 我想每10秒钟刷新一次页面。

var xhr = new XMLHttpRequest();                 // Create XMLHttpRequest object

xhr.onload = function() {                       // When response has loaded
  // The following conditional check will not work locally - only on a server
  if(xhr.status === 200) {                       // If server status was ok
    document.getElementById('live').innerHTML = xhr.responseText; // Update
  }
};

xhr.open('GET', 'livedata.php', true);        // Prepare the request
xhr.send(null);                                 // Send the request

Just for reference here is index.php 仅供参考，这里是index.php

    <!doctype html>

<html>

<head>
    <title>Page Title</title>
    <meta charset="UTF-8">
    <meta name="viewport" content="initial-scale=1.0">
</head>

<body>
    <section id="live">
        <p>please wait... loading content</p>
    </section>
    <script src="scripts.js"></script>
</body>

</html>

Answer 1

You can try this: 您可以尝试以下方法：

function getData() {
  var xhr = new XMLHttpRequest();                 // Create XMLHttpRequest object

  xhr.onload = function() {                       // When response has loaded
    // The following conditional check will not work locally - only on a server
    if(xhr.status === 200) {                       // If server status was ok
      document.getElementById('live').innerHTML = xhr.responseText; // Update
    }
  };

  xhr.open('GET', 'livedata.php', true);        // Prepare the request
  xhr.send(null);                                 // Send the request
}

setInterval(getData, 1000*10);

刷新div内容，无需Jquery，AJAX

问题描述

1 个解决方案

解决方案1
0 2017-09-28 02:42:46

刷新div内容，无需Jquery，AJAX

问题描述

1 个解决方案

解决方案1 0 2017-09-28 02:42:46

解决方案1
0 2017-09-28 02:42:46