js页面刷新之实现框架内外刷新(整体、局部)
这次总结的是框架刷新:
框架内外的按钮均可以定义网页重定向,
框架内部页面的按钮可以实现局部刷新,
框架外部页面的按钮可以实现整页刷新。
代码如下(两个html页面):
<!--主界面index.html-->
<iframe src="页面刷新.html" frameborder="1"></iframe>
<h1 id="iframeout">框架外内容</h1>
<button onclick="fresh()">框架外刷新</button> <script>
var h1 = document.getElementById('iframeout');
function iframeout(){
h1.style.color = "yellow";
h1.innerText = "我变化了";
}
setInterval(iframeout, 800);
function fresh(){
// 框架主页面刷新,可以实现下面两个功能:
top.location.reload(); //刷新整页
// window.parent.location.href='http://koushuling.top'; //框架页重定向
}
</script>
<!--框架页面:页面刷新.html-->
<style>
body{
background-color: gray;
}
</style> <h1 id="test">框架内页面</h1>
<button onclick="fresh()">框架内刷新</button> <script>
var h1 = document.getElementById('test');
function test(){
h1.style.color = "red";
h1.innerText = "我变化了";
}
setInterval(test, 1000);
function fresh(){
// 框架内页面刷新:可实现局部刷新与整个页面重定向
self.location.reload(); //刷新框架内页面
// window.parent.location.href='http://koushuling.top'; //页面重定向
}
</script>
如有错误,请您更正!
js页面刷新之实现框架内外刷新(整体、局部)的更多相关文章
- js页面跳转(含框架跳转)整理
js方式的页面跳转1.window.location.href方式 <script language="javascript" type="text/java ...
- js 实现返回上一页和刷新等页面跳转功能
原文 出处http://www.2cto.com/kf/201111/109821.html 1. Javascript 返回上一页history.go(-1), 返回两个页面: history.go ...
- js页面刷新跳转的几种方式及区别
跳转常用方法: window.location.href="index.php"; window.history.back(-1);//类似于按钮,参数是负几,就后退几次. win ...
- JS 页面刷新或重载
一.先来看一个简单的例子:下面以三个页面分别命名为frame.html.top.html.bottom.html为例来具体说明如何做.frame.html 由上(top.html)下(bottom.h ...
- JS页面跳转和js对iframe进行页面跳转、刷新
一.js方式的页面跳转1.window.location.href方式 <script language="JavaScript" type="text/ja ...
- JS 页面刷新以及页面返回的几种方式
1.通过标签形式的跳转页面 <a class="popup" href="~/WeiXin/Shoppingguide/StockData">&l ...
- JavaScript刷新页面的方法(包括Frame框架的刷新方式)
JavaScript刷新页面的方法 1 history.go(0) 去指定的某页 2 window.location.reload()刷新当前页面 window.location.relo ...
- PHP和JS页面跳转和刷新总结
PHP 页面跳转: // 只是跳转,所以一定要用die();或者exit;终止下一步操作; header('location:index.php'); exit; // 等待3秒,跳转并刷新 head ...
- js页面刷新之实现普通页面
准备面试题目的时候遇到了页面刷新,就整理了一下,网上查找,大概就是八种方法,但是自己测试的时候出现了几个问题,跟大家分享: 首先准备一个测试页面: <!--html代码--> <h1 ...
随机推荐
- ArcGIS AddIN之工具不可用
AddIN做的工具,第一次打开时工具亮起(可用),第一次点击之后工具就灰掉(不可用) 原因:该工具没有找到响应函数 具体原因:之前做的好多工具,好多个项目,好多代码.现在统一放到一个项目中,一个工具条 ...
- js的关联数组
我自己感觉js是不支持关联数组的,只有索引数组.想要实现js关联数组的效果,就使用js的对象,使用键值对.如果对数组动态处理用push函数,取值用pop函数.此外,对数组操作有几个比较好的函数,joi ...
- UIBezierPath 的使用
使用UIBezierPath类可以创建基于矢量的路径,这个类在UIKit中.此类是Core Graphics框架关于path的一个封装.使用此类可以定义简单的形状,如椭圆或者矩形,或者有多个直线和曲线 ...
- windows7远程桌面连接unbuntu12.04
参考:http://mawenjian.net/p/1221.html http://blog.csdn.net/chengfei112233/article/details/6623672 http ...
- Android课程---单选框与复选框的实现
<?xml version="1.0" encoding="utf-8"?> <manifest xmlns:android="ht ...
- IOS第二天多线程-05NSOperationQueue 暂停,和恢复队列任务
*********** #import "HMViewController.h" @interface HMViewController () <UITableViewDel ...
- IOS第15天(2,事件处理hitTest练习)
***hitTest 获取最合适的点 @implementation HMGreenView - (void)touchesBegan:(NSSet *)touches withEvent:(UIEv ...
- Android实现推送方式解决方案
当我们开发需要和服务器交互的应用程序时,基本上都需要获取服务器端的数据,比如<地震应急通>就需要及时获取服务器上最新的地震信息. 要获取服务器上不定时更新的信息,一般来说有两种方法: 第一 ...
- mysql查询结果添加编号
第一种方法: select (@i:=@i+1) as i,table_name.* from table_name,(select @i:=0) as it 第二种方 ...
- 蓝牙协议栈记录—BTStack
TSTack User Guid 翻译过来的 1.简介 2.BTStack 架构 BTStack在所实现的协议和服务之间采用很多状态机实现相互作用,特点: <1>单线程.BTStack只有 ...