divを更新しますが、phpファイルから新しいコンテンツがある場合のみ

少し前に同様の問題に直面しました。コメントストレージサーバーサイドにmysqlなどを使用していると思いますか？

最初にタイムスタンプ整数列をmysqlテーブルに追加し、次に新しい行を追加するときに、単にtime()を使用することで問題を解決しました。現在の時間を保存します。

mysql行挿入の例：

$query = "INSERT INTO comments (name, text, timestamp) VALUES ('". $name ."', '". $text ."',". time() .");";

ステップ2は、サーバーサイドから送信するデータをjson_encodeすることです。

$output = array();

if ($html && $html !== '') {   // do we have any script output ?
  $output['payload'] = $html;  // your current script output would go in this variable
}
$output['time'] = time();      // so we know when did we last check for payload update

$json = json_encode($output, ((int)JSON_NUMERIC_CHECK)); // jsonify the array
echo $json;                    // send it to the client

したがって、純粋なhtmlの代わりに、サーバーサイドスクリプトは次のようなものを返します。

{
  "payload":"<div class=\"name\">Derpin<\/div><div class=\"msg\">Foo Bar!<\/div>",
  "time":1354167493
}

JavaScriptのデータを簡単に取得できます：

<script type="text/javascript"> // <![CDATA[

var lastcheck;
var content_main = $('#content_main');

pollTimer = setInterval(function() {
  updateJson();
}, 10000);

function updateJson() {
  var request = '/feed_main.php?timestamp='+ (lastcheck ? lastcheck : 0);

  $.ajax({
    url: request,
    dataType: 'json',
    async: false,
    cache: false,
    success: function(result) {
      if (result.payload) {        // new data
        lastcheck = result.time;   // update stored timestamp
        content_main.html(result.payload + content_main.html()); // update html element
      } else {                     // no new data, update only timestamp
        lastcheck = result.time;
      }
    }
  });
}

// ]]> </script>

これでサーバーとクライアント間の通信がほぼ処理されるので、データベースに次のようにクエリを実行するだけです。

$timestamp = 0;
$where = '';

if (isset($_GET['timestamp'])) {
  $timestamp = your_arg_sanitizer($_GET['timestamp']);
}

if ($timestamp) {
  $where = ' WHERE timestamp >= '.$timestamp;
}

$query = 'SELECT * FROM comments'. $where .' ORDER BY timestamp DESC;';

タイムスタンプは前後に渡され、クライアントは常に前のクエリでサーバーから返されたタイムスタンプを送信します。

サーバーは、前回チェックしてから送信されたコメントのみを送信し、私が行ったように、HTMLの最後にコメントを追加できます。（警告：それにはいかなる種類の健全性制御も追加していません。コメントが非常に長くなる可能性があります）

10秒ごとに新しいデータをポーリングするため、ajax呼び出し全体に純粋なデータを送信して、チャンクの帯域幅を大幅に節約することを検討してください（タイムスタンプのみを含むjson文字列は約20バイトです）。

次に、javascriptを使用してhtmlを生成できます。また、サーバーからクライアントに多くの作業をオフロードするという利点もあります:)。また、一度に表示するコメントの数をより細かく制御できます。

私はかなり大きな仮定をしました、あなたはあなたのニーズに合うようにコードを修正しなければならないでしょう。私のコードを使用していて、猫|コンピューター|家が爆発した場合、すべてのピースを保持することができます:)