首页 > 其他 > 详细

暗度陈仓——试探隐藏框架的妙用

时间:2014-03-01 04:33:54      阅读:359      评论:0      收藏:0      [点我收藏+]

   前一篇博客,介绍到了Ajax。Ajax主要是实现客户端与服务器端的异步通信。但是在Ajax没有出现之前,开发者又是如何实现异步通信的呢?下面就给大家介绍一下隐藏框架的使用。 

   所谓隐藏框架,就是设置框架页显示高度为0,以达到隐藏显示的目的。

看下面的例子:

   1.新建一个简单的框架集:(隐藏框架.html)    

<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>隐藏框架实现异步通信</title>
</head>

// 为了能够清晰的看到效果,此物没有将框架进行隐藏
<frameset rows="50%,50%">   
	<frame src="隐藏框架_main.html" name="main" />
	<frame src="隐藏框架_black.html"  name="serve" />
	</frameset>
	<noframes></noframes>

 2.新建空白页(隐藏框架_black.html)   

<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>空白页</title>
</head>
<body>
<h1>空白页</h1>
</body>

   3.客户交互页面(隐藏框架_main.html)

   

<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>与客户交互页面</title>
<script language="javascript" type="text/javascript">
function request(){
	parent.frames[1].location.href="隐藏框架_serve.html";
}
window.onload=function(){
	var b=document.getElementsByTagName("input")[0];
	b.onlick=request;
}
</script>
</head>

<body>
<h1>客户交互页面</h1>
<input name="submit" type="button"  onclick="request()" id="submit" value="向服务器端发送请求"/>

</body>

   4.创建服务器页面(隐藏框架_serve.html),利用Javascript脚本动态改变客户交互页面的显示信息。


<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>服务器端响应页面</title>
<script language="javascript" type="text/javascript">
new function(){
	parent.frames[0].document.write("<h1>Hi,大家好,我是从服务器端传过来的使者喔~~。</h1>");
}
</script>
</head>

<body>
<h1>服务器端响应页面</h1>

</body>

   最后显示出来的效果图:


bubuko.com,布布扣


暗度陈仓——试探隐藏框架的妙用,布布扣,bubuko.com

暗度陈仓——试探隐藏框架的妙用

原文:http://blog.csdn.net/mingxuanyun/article/details/20043111

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!