このjQuery/Ajax関数で何が問題になっていますか？

Question

私は、サーバーからデータを要求するためにjQuery/Ajaxを使用するオンラインチャットルームを持っています。しかし、私が使っているメソッドは非常に非効率的で、チャットの内容が変更された場合（新しいメッセージなど）、サーバのデータを読み込むだけで改善しようとしています。メソッドは論理的に正しいと思われますが、本当に。私は以下のコードを添付しました。私が間違っていることを教えてください。これは私に非常に苦労しています。私は、サーバーからのデータが異なる場合にのみchat divを変更したい。

function loadMsgs() 
{ 
var v_loadMsgs = new XMLHttpRequest(); 

v_loadMsgs.open("GET", "msgs.php"); 

v_loadMsgs.onreadystatechange = function() 
{ 
    var old_content = $("#msgs").html(); 
    var new_content = v_loadMsgs.responseText; 

    if (old_content != new_content) 
    { 
     $("#msgs").html(new_content); 
    } 

    if (old_content == new_content) 
    { 
     $("#msgs").html("EQUAL!"); // only here for testing 
    } 
}; 

v_loadMsgs.send(null); 
} 

Answer 1

jQueryのAJAX関数を使用しています。彼らはすべてが本当に簡単ます

function loadMsgs() 
{ 
    jQuery.get("msgs.php", function(data) 
    { 
     if ($("#msgs").html() != data) 
     { 
      $("#msgs").html(data); 
     } else { 
      $("#msgs").html("EQUAL!"); // only here for testing 
     } 
    }); 
} 

あなたが本当にあなたの方法は、サーバが実際にあなたに（返す4のreadyState）応答を送信した場合、あなたがチェックしていない機能していない理由を知りたい場合は、次の

Answer 2

あなたが.html()を行うとjquery's ajax functions

Answer 3

を使用してみてください、ブラウザはあなたにきちんとフォーマットされたHTMLを提供します。つまり、すべてのタグが閉じられ、すべての属性が引用符で囲まれています。 msgs.phpから戻ってきたものは、おそらく完全にはフォーマットされていません。したがって、その違い。

しかし、効率が悪いと心配している場合は、はまだと非常に効率が悪いです。つまり、あなたは不必要にUIを更新しませんが、サーバーからのメッセージのリストを読み込んでいますか？

ここで2バイトを節約するために、 "if-modified"テクニックを採用してください。つまり、メッセージのリストとともに、何らかのタイムスタンプを返します。言って、ちょうど整数。サーバー上で何かが変わったら、その整数を1つ増やしてください。サーバーからの更新をリクエストするときは、AJAXコードに以前に受信したタイムスタンプを渡して、タイムスタンプが最新の場合はサーバーに「何も変更されていません」と応答させます。それ以外の場合は、サーバーにメッセージの新しいリストを送信させます。これはおおよそのアイデアです。