当我清楚地看到该元素时，无法确认该元素存在于页面上

Question

我正在使用一个利用 jQuery 的函数来从 JSON 提要中获取信息。这里的问题是，我必须从提要中选择 10 个符合去年标准的项目（从请求的角度来看，需要 310 亿毫秒），并且我必须使用变量指定我想要从提要中获得多少结果插入到 URL 中的“maxRows”。这是函数...

function topTen(rows) {
    $.getJSON("http://ws.geonames.org/earthquakesJSON?north=90&south=-90&east=-180&west=180&maxRows=" + rows, 
        function(json) {
            var topTen = new Array();
            var now = new Date();
            var i;
            for(i = 0; i < json.earthquakes.length; i++)
            {
                var time = json.earthquakes[i].datetime;
                var then = new Date(time.replace(" ", "T"));
                if(now - then < 31536000000) { topTen.push(json.earthquakes[i].eqid); }
            }
            if(topTen.length >= 10)
            {
                var html = "The Top Ten Earthquakes Of The Past Year<ol>";
                for(i = 1; i <= 10; i++)
                {
                    html += "<li id='number" + i + "' >" + topTen[i - 1] + "</li>";
                }
                html += "</ol>";
                $('#top_ten').html(html);
            }
        });
}

现在的问题是，从第一个请求开始，我很可能不会得到 10 个符合我标准的结果。因此，为了抵消这一点，我尝试将函数置于循环中，直到满足另一个条件。但是，这总是以失败告终，因为 getJSON 函数（或者可能是回调）是异步的，这意味着如果我尝试类似

    var rows = 10;
    do{
        topTen(rows);
        rows += 10;
    while(!document.getElementById("number10"))

然而，问题就变成了，执行实际工作的函数不受循环的逐行计时限制，因此循环本身在任何函数实际完成之前运行了很多很多很多次并且满足循环条件。所以现在我正在尝试设计另一种类似这样的方法

    topTen(rows);
    rows += 10;
    pause(1000);
    topTen(rows);
    rows += 10;
    pause(1000);
    topTen(rows);
    rows += 10;
    pause(1000);
    if(document.getElementById("number10"))
        alert("There's 10!");
    else
        alert("There's not 10!");

暂停基本上就是它听起来的样子，以毫秒为单位。在我复制和粘贴的循环中将初始日期对象与以后的日期对象进行简单比较。这样可以防止函数一个接一个地立即触发，但问题是永远不会满足 if 条件。我不知道它是什么，但无论我允许暂停多少时间，getElementById 函数似乎永远不会找到 id 为“number10”的元素，即使我可以在 Firebug 中非常清楚地看到它。

因为这个问题，我的浏览器已经崩溃了好几次了，我真的被 PO'd 和厌烦了。如果有人能找到这个问题的解决方案，甚至提出更简单、更优雅的解决方案，我将不胜感激。

PS - 我尝试过诸如全局变量之类的方法，并使用递归从回调函数内部调用 topTen() 并发送一个更大的“行”变量，但这些都不起作用，因为回调函数似乎是在他们自己包含的小世界中，我的其余 90% 的 JavaScript 都不存在。

Answer 1

你做错了...

您需要等待一个呼叫返回，然后才能再次呼叫。幸运的是，您已经有一个函数被调用并返回。因此，对该函数进行简单的更改即可完成。

var topTenList = new Array();


function topTen(rows) {
    $.getJSON("http://ws.geonames.org/earthquakesJSON?north=90&south=-90&east=-180&west=180&maxRows=" + rows, 
        function(json) {
            var now = new Date();
            var i;
            for(i = 0; i < json.earthquakes.length; i++)
            {
                var time = json.earthquakes[i].datetime;
                var then = new Date(time.replace(" ", "T"));
                if(now - then < 31536000000) { topTenList.push(json.earthquakes[i].eqid); }
            }
            if (topTenList.length < 10)
            {
               topTen(rows+10);
               return;
            }
            else
            {
                var html = "The Top Ten Earthquakes Of The Past Year<ol>";
                for(i = 1; i <= 10; i++)
                {
                    html += "<li id='number" + i + "' >" + topTenList[i - 1] + "</li>";
                }
                html += "</ol>";
                $('#top_ten').html(html);
            }
        });
}