动态DOM元素未被选为lastChild

时间:2011-02-25 19:20:35

标签: javascript ajax dom

我有一个奇怪的问题,在firefox中展示自己(没有经过测试等等,但需要它在firefox中工作)。我正在使用ajax用包含从DB返回的信息的div填充父div。服务器端是PHP,带有一个while循环,迭代结果集并回显每个div。

整个脚本工作正常并使用不同数量的子节点填充父div(父div ='webses'的#ID),问题是当我在获取新集合后检查最后一个子节点时通过ajax的divs,lastChild报告为以前填充的lastChild。

一个例子是:

'#webses'有4个childNodes(div),最后一个childNode有ID'no4',然后我重新填充#webses下的整个childNodes集,添加一个ID为'no5'的新div,然后查询ID最后一个孩子在重新填充div的函数结束时'immidiately',lastChild返回'no4'。然后我可以运行相同的查询(一旦函数完成)在#webses上检查lastChild(通过浏览器地址栏),然后正确返回no5!

以下是展示问题的代码示例(使用alert在lastChild上显示ID的值):

function populateWebses() {

//populates parentNode DIV 'webses' with divs populated via AJAX
populateParentNodeViaAJAX();

alert(document.getElementById("webses").lastChild.id);
}

在使用新的childNodes更新“#webses”下的DOM之后,查看lastChild的查询会立即执行,我想这是问题,但为什么呢?

任何帮助都非常感激。

1 个答案:

答案 0 :(得分:2)

AJAX意味着异步Javascript。执行警报时,populateParentNodeViaAJAX()方法尚未完成,因此返回“旧”值。

如果需要执行某种依赖于Ajax方法已完成的操作,则需要使用回调机制(仅在Ajax调用完成后调用函数X)。