我很好奇人们在Ajax Web应用程序中在运行时替换整个文档的经历.这种情况很少见,但我发现应用程序需要整个页面重建的一些情况,并且所有内容都存在于本地而无需另外的服务器往返.
我可以很容易地准备新的文档或者一个新的DOM树或字符串.所以我正在评估各种方法的权衡.
如果我想使用String方法,这似乎工作:
document.open();
document.write(newStringDoc);
document.close();
大多数浏览器都做得很好,但很多浏览器在重新渲染时会有轻微的闪烁.我注意到,第二次通过Firefox 4.0b7只会坐在那里旋转,好像它正在加载.点击位置栏上的停止按钮似乎完成了页面渲染.(编辑:这似乎在4.0b8中修复)此外,此方法似乎阻止用户点击刷新以重新加载当前URL(它重新加载动态生成的页面).
如果我使用新的DOM树方法(在灵活性和速度方面有不同的优点/缺点),那么这似乎有效:
document.replaceChild(newDomDoc, document.documentElement);
大多数浏览器似乎完全没有闪烁处理这个.不幸的是,IE9 beta会抛出"DOM Exception:HIERARCHY_REQUEST_ERR(3)" replaceChild并且永远不会完成.我还没有尝试过最新的预览版本,看看这是否只是一个修复过的新bug.(编辑:这似乎是在RC1中修复的.)
我的问题:有没有人采用与其中任何一种不同的方法？有没有人有任何其他警告,或许某个浏览器从根本上打破了这些方法之一？
更新:也许这将增加背景并有助于想象力.考虑应用程序脱机的情况.没有可用于重定向或刷新的服务器.应用程序的必要状态已经加载(或存储)在客户端.UI由客户端模板构成.
我相信Gmail会使用嵌入在根文档中的iframe.看来,至少其中一些iframe的起始文档只是一个裸HTML5文档,然后父文档才会操作.
使用iframe将是替换当前文档的替代整个子iframe或仅替换其文档的另一种变体.虽然将新文档附加到iframe的方法存在同样的情况.