迁移 http://aikin.me/2014/06/16/ie-iframe-cache/
最近“致力于”调 IE9 、IE10 、 firefox 、 chrome 浏览器对 iframe刷新。 发现在IE浏览器中,有些刷新 iframe 的方法会加载缓存。以下就对一些方法在 IE9 、IE10(以下简称IE)的产生效果介绍一下:
1、对 iframe 的 src 属性重新赋值来实现刷新
$("#iframeId").attr("src", $("#iframeId").attr("src"));
在 IE 中,使用这个方法后 iframe 没有刷新的效果。iframe反应很平静。
2、location.replace(URL) 方法
$("#iframeId")[0].contentWindow.location.replace(url);
或
document.getElementById("iframeId").contentWindow.location.replace(url);
注: contentWindow.location.replace === contentWindow.document.location.replace
返回值为 true, 也就是两个方法是相同的。
在W3School对这个方法是这么描述的:(1). replace() 方法可用一个新文档取代当前文档;
(2). replace() 方法不会在 History 对象中生成一个新的记录。当使
用该方法时,新的 URL 将覆盖 History 对象中的当前记录。
也就是说该方法通过指定URL替换当前缓存在历史的记录,因此当使用replace方法之后,不能通过“前进”和“后退”来访问已经被替换的URL。
但是在 IE 中使用这个方法和描述的效果。将会用新的 url 内容替换掉当前的历史记录。
3、location.reload(force)方法
$("#iframeId")[0].contentWindow.location.relaod(true);
或
document.getElementById("iframeId").contentWindow.location.reload(true);
注: contentWindow.location.reload === contentWindow.document.location.reload
返回值为 true, 也就是两个方法是相同的。
该方法用于重新加载当前页面。可选参数:force 是Boolean类型的。
在W3School上对该方法的描述: (1). 如果该方法没有规定参数,或者参数是 false,它就会用 HTTP 头
If-Modified-Since 来检测服务器上的文档是否已改变。
(2). 如果文档已改变,reload() 会再次下载该文档。
(3). 如果文档未改变,则该方法将从缓存中装载文档。这与用户单击
浏览器的刷新按钮的效果是完全一样的。
(4). 如果把该方法的参数设置为 true,那么无论文档的最后修改日期
是什么,它都会绕过缓存,从服务器上重新下载该文档。这与用户
在单击浏览器的刷新按钮时按住 Shift 健的效果是完全一样。
可见这方法才是重载 iframe 的正确方法。在 IE中使用该方法,会重新从服务器获取新的页面,不会加载
缓存。
4、替换缓存
虽然这个方法可以实现重新从服务器上,获取新的页面,但是它只能获取当前窗口的。当一个 iframe中有两个或两个以上的可以相互跳转的页面,你同时要重新去加载这些页面。这时 reload 方法,就不是很适用了(因为 reload 方法没法同时从服务器上获取多个页面)。
所以在 IE 中,可以使用 ajax 去GET 这些页面,来替换更新本地的缓存,在刷新 iframe。下面的方法就是用 ajax 去替换本地的缓存的方法。
$.ajax({
type: "GET",
url: url,
dataType: "text",
beforeSend: function (xmlHttp) {
xmlHttp.setRequestHeader("If-Modified-Since", "0");
xmlHttp.setRequestHeader("Cache-Control", "no-cache");
}
}).done(function () {
console.log('replace cache ok');
})
If-Modified-Since控制缓存页面时间,在发送HTTP请求时,把浏览器端缓存页面的最后修改时间一起发到服务器去,服务器会把这个时间与服务器上实际文件的最后修改时间进行比较。
Cache-Control 控制是否要进行缓存页面。
相关推荐
vue项目中一个模板组件,不同iframe的src地址,对应不同的路由,不同标签页,且切换标签页不重载。这种客户的要求是特例在网上没有,所以纯自行手码。由于项目在vuex保存了标签页,所以初次进入该组件时,调用了一次...
页面中的使用到Iframe时,我们如何需要对IFrame中页面是否改变进行判断,我们可以使用到window.onbeforeunload事件.
如运算符重载和函数重载 字符串连接,+=运算符重载 求子串: 左边几个字符,,, Left(int nCount) 右边几个,, Right(int nCount) 某个位置开始的几个字符 Mid(int nPos,int nCout) 2..进一步熟悉掌握对类的构造...
实验六函数重载与运算符重载 实验六函数重载与运算符重载
运算符重载.py python运算符重载
[优化] 切换tab自动刷新支持每个子页面自定义刷新方法,可实现切换tab只重载表格 [优化] treeTable升级(增加toolbar、筛选列、拖拽列宽等)、dataGrid重构(兼容旧版) [优化] 页面层弹窗也支持tpl:true,弹窗开启tpl会...
(3)编写重载函数Maxl可分别求取两个整数,三个整数,两个双精度数,三个双精度数的最大值。 (4)使用重载函数模板重新实现上小题中的函数Maxl。 (5)使用系统函数pow(x,y)计算xy的值,注意包含头文件math.h。 ...
实现操作符重载实现操作符重载实现操作符重载实现操作符重载实现操作符重载
x86内核重载
C++单目运算符重载 单目运算符只有一个操作数,如!a,-b,&c,*p,还有最常用的++i和–i等。重载单目运算符的方法与重载双目运算符的方法是类似的。但由于单目运算符只有一个操作数,因此运算符重载函数只有一个参数...
详细介绍 C++运算符重载 的PPT 文中部分内容: 下标运算符“[ ]”重载 C++把下标运算符[ ]看成一个双目运算符,其操作数为<基本表达式>和<表达式>,对应的运算符为operator[ ],必须重载为一个成员函数。对于下标...
重载重载重载重载重载重载重载重载重载重载重载重载重载重载重载重载重载重载
对于C++重载的使用方法学习的好例子 1、符号重载的方法使用。
运算符重载(c++ 最会的重载100)
C++函数重载的例子解析,C++函数模板重载
重载与覆写/重写的区别 区别 重载 覆写 1 单词 OverLoading Override 2 概念 方法名称相同,参数的类型或个数不同 方法名称相同,参数的类型或个数相 同,返回值类型相同 3 范围 发生在一个类之中...
webview重载说明,如何使用webview
本文实例为大家分享了layui表格数据重载,供大家参考,具体内容如下 html代码 <form class=layui-form action=> <input type=text id=userName name=userName requi
重载函数
C++ 函数重载 运算符重载 类型转化 符合课本 自己写的 绝对运行 有用