Javascript 处理从AJAX调用返回的数据

我使用以下脚本加载从node.js服务器生成的HTML页面：

    (function nodeLoader(){
        $.ajax({
            url: "http://oclock.dyndns.org:8000",
            method: "get",
            data: {hk: hk },
            success: function(data){
                var visibile = $("div.scheda:visible").attr("id");
                $('.scheda').hide('fast',function(){$('#99').html(data).show();});
                setTimeout( function(){
                    //devo prendere id del messaggio visualizzato e settarlo a letto
                    $('.scheda').hide('fast',function(){$('#'+visibile).show().html(data);});
                },30000 );
            }
        });
    })();

加载的页面如下所示：

<div id="container"></div>

<script>
// create a new websocket
var socket = io.connect('http://oclock.dyndns.org:8000');
// on message received we print all the data inside the #container div
socket.on('notification', function (data) {
    var msgs = '';
    $.each(data.flashmsgs,function(index,flashmsg){
        msgs += "<div>"
        msgs += "<h3>Messaggio inviato da " + flashmsg.created_by + "</h3><br>";
        msgs += "<p>" + flashmsg.testo + "</p></div>";
    });
    $('#container').html(msgs);
});
</script>

//创建新的websocket
var socket=io.connect（'http://oclock.dyndns.org:8000');
//收到消息后，我们打印#container div中的所有数据
socket.on（'notification'，函数（数据）{
var-msgs=''；
$.each（data.flashmsgs，函数（index，flashmsg）{
msgs+=“”
msgs+=“Messaggio inviato da”+flashmsg.created_by+”
”；
msgs+=“”+flashmsg.testo+”
”；
});
$（'#container'）.html（msgs）；
});

我试图得到的是在nodeLoader中添加一个if（在success函数中），表示：如果容器包含数据（node.js服务器正在获取数据），则执行隐藏和显示。

---

我该怎么做？如何向下钻取数据变量？我唯一的想法是将node.js服务器改为提供json数组，而不是页面，但我现在不想重写服务器。

我也遇到了类似的问题，找到一种灵活的方式将一些元数据与

HTML

一起传递，这真的非常痛苦。当然，最好的方法是使用

JSON

，但是如果您不能进行这样的更改，那么在不重写大量代码的情况下，仍然有一些可能的解决方案来实现这一点

第一个是在注释节点中包含一些元数据，例如：

<!--META:{"count":3}-->
<ul>
    <li>Message 1</li>
    <li>Message 2</li>
    <li>Message 3</li>
</ul>

第三个是手动操作数据，但是让

JavaScript

代码非常依赖

HTML

DOM

结构不是一个很好的实践

$.ajax({
    ...
    success: function(data) {
        var count = $(data).find('li').length; // count == 3
    }
});

最后，与第一种方法类似，您可以只使用一些隐藏节点：

<input type="hidden" name="count" value="3" />
<ul>
    <li>Message 1</li>
    <li>Message 2</li>
    <li>Message 3</li>
</ul>

---

我希望这有帮助。

是的！所以你说：在目标div中加载数据，看看数据计数是否大于0，然后显示div？@LelioFaieta是的，任意方式：）

<input type="hidden" name="count" value="3" />
<ul>
    <li>Message 1</li>
    <li>Message 2</li>
    <li>Message 3</li>
</ul>

<ul class="messages" data-count="3"> <!-- NOTE: Don't forget to cast attribute value to Integer in JavaScript -->
    <li>Message 1</li>
    <li>Message 2</li>
    <li>Message 3</li>
</ul>