使用框架集实施异步交互存在着很多弊端：
❑一方面，页面被深深地打上框架的烙印，不利于结构优化，浏览器的支持也受到很多限制，需要更多的文件配合使用。
❑另一方面，框架集缺乏灵活性，要完全使用脚本控制异步请求与交互就非常不方便。iframe与frameset（框架集）都可以实现动态加载客户端或服务器端任何类型的网页文件，也就是说，它们的功能相同，但表现形式各异。iframe被定义为文档结构元素，与页面中其他普通元素无异，完全与框架集无关，但frameset被定义为窗口元素，与html、head和body等基本文档结构元素平行使用，可以说iframe与frameset分别属于不同级别的元素。因此，浮动框架可以插入到页面中的任意位置，与页面中其他元素能够很好地融合。同时开发人员还可以在JavaScript脚本中动态创建iframe元素并进行控制，这就给异步交互开发带来新的活力。下面仍然以上面的示例为基础进行扩展。
第1步，在客户端交互页面中新建函数hideIframe，使用该函数动态创建浮动框架，借助这个浮动框架实现与服务器进行异步通信，具体代码如下：
//创建浮动框架
//参数：url表示要请求的服务器端文件路径//返回值：无
function hideIframe(url){
var hideFrame=null;
hideFrame=document.createElement("iframe");
//创建iframe元素
hideFrame.name="hideFrame";
hideFrame.id="hideFrame";
hideFrame.style.;hideFrame.style.;
hideFrame.style.position="absolute";hideFrame.style.visibility="hidden";document.body.appendChild(hideFrame);setTimeout(function{
frames["hideFrame"].location.href=url;},10)
}
当使用DOM创建iframe元素时，应注意设置同名的name和id属性，因为不同类型浏览器在引用框架时会分别使用name或id属性值。在创建好iframe元素后，大部分浏览器（如Firefox和Opera）会需要一点时间（约为几毫秒）来识别新框架并将其添加到帧集合中，因此，当加载地址准备向服务器进行请求时，应该使用setTimeout函数将发送请求的操作延迟10 ms。当执行请求时，浏览器能够识别这些新的框架，避免发生错误。
如果页面中多处需要调用请求函数，则建议定义一个全局变量，专门用来存储浮动框架对象，这样就可以避免每次请求时都创建新的iframe对象。
第2步，修改客户端交互页面中request函数的请求内容，直接调用hideIframe函数，并传递URL参数信息。
function request{//异步请求函数
var user=document.getElementById("user");
var pass=document.getElementById("pass");
var s="iframe_serve.html?user="+user.value+"＆pass="+
pass.value;
hideIframe(s);
}
由于浮动框架与框架集属于不同级别的作用域，浮动框架被包含在当前窗口中，所以应该使用parent而不是parent.frames[0]来调用回调函数，或者在回调函数中读取文档中的元素，代码如下：
function callback(b,n){
if(b＆＆n){
var e=document.getElementsByTagName("body")[0];
e.innerHTML="＜h1＞"+n+"＜/h1＞＜p＞您好，欢迎登录站点＜/p＞";
}
else{
alert("你输入的用户名或密码有误，请重新输入");
var user=parent.document.getElementById("user");
var pass=parent.document.getElementById("pass");
user.;
pass.;
}
}
在服务器端响应页面中也应该修改引用客户端回调函数的路径，代码如下：
window.onload=function{
//...
parent.callback(b,n);
}
这样iframe浮动框架只需要两个文件：客户端交互页面（iframe_main.html）和服务器端响应页面（iframe_serve.html），就可以完成异步信息交互的任务。该示例的演示效果与建议137的示例相同，只不过完善了部分代码，因此不再进行效果演示和代码详解。