IE 缓存策略的BUG的解决方法

721521王

721521王

2016-02-19 09:16

下面请跟着图老师小编一起来了解下IE 缓存策略的BUG的解决方法,精心挑选的内容希望大家喜欢,不要忘记点个赞哦!
今天是发现bug的高产期。

IE在解析innerHTML的时候居然会忽略Cache策略,简单的重复加载图片。请看以下代码:

HTML
HEAD
BODY
SCRIPT LANGUAGE="JavaScript"
!--
var st="img src="http://imgcache.qq.com/qzone/item/orig/11/3179_5.gif""
var ar = new Array(101);
window.onload=function(){
    document.body.innerHTML = ar.join(st);
}
//--
/SCRIPT
/BODY
/HTML

保存到本地作为一个htm文件,然后用IE打开(允许脚本运行),然后用http监视工具可以看到,IE发起了100个请求,一个都不cache!

在FireFox下面就没有问题,只发起一个请求。
代码如下:

用这段代码可以解决这个问题 

html 
head 
script language=javaScript 
var imageholder=new Image() 
imageholder.src="http://imgcache.qq.com/qzone/item/orig/11/3179_5.gif" 
/script 
/head 
body 
div id="div1"/div 
script language=javaScript 
document.getElementById("div1").innerHTML = 
"img id='p1'img id='p2'img id='p3'"; 
document.getElementById("p1").src=imageholder.src; 
document.getElementById("p2").src=imageholder.src; 
document.getElementById("p3").src=imageholder.src; 
/script 
/body 
/html 

代码如下:

这个bug的官方描述见: 

http://support.microsoft.com/default.aspx?scid=kb;en-us;319546 

此外 http://www.bazon.net/mishoo/Articles/msie/958/ 指出background-image会带来一样的问题。 

ms的官方解决方案是象这样: 

HTML 
HEAD 
BODY 

SCRIPT LANGUAGE="JavaScript" 
!-- 
var st="img src="http://imgcache.qq.com/qzone/item/orig/11/3179_5.gif"http://imgcache.qq.com/qzone/item/orig/11/3179_5.gif"" 
var ar = new Array(101); 
function test(){ 
document.getElementById("d").innerHTML = ar.join(st); 
document.getElementById("d").style.display="block"; 

setTimeout("test()",1000); 
//-- 
/SCRIPT 
div id="d"img src="http://imgcache.qq.com/qzone/item/orig/11/3179_5.gif"http://imgcache.qq.com/qzone/item/orig/11/3179_5.gif"/div 
/BODY 
/HTML 

如果不怕麻烦的话,这样做可以更快一点点,也更保险: 

HTML 
HEAD 
BODY 
SCRIPT LANGUAGE="JavaScript" 
!-- 
var st="img src="http://imgcache.qq.com/qzone/item/orig/11/3179_5.gif"http://imgcache.qq.com/qzone/item/orig/11/3179_5.gif"" 
var ar = new Array(101); 
function test(){ 
document.getElementById("d").innerHTML = ar.join(st); 
document.getElementById("d").style.display="block"; 

//-- 
/SCRIPT 
div id="d"img src="http://imgcache.qq.com/qzone/item/orig/11/3179_5.gif"http://imgcache.qq.com/qzone/item/orig/11/3179_5.gif" onreadystatechange="if(readyState=='complete')setTimeout('test()',0)"/div 
/BODY 
/HTML 

更多方法:
http://www.blogjava.net/emu/archive/2006/03/01/33082.html
展开更多 50%)
分享

猜你喜欢

IE 缓存策略的BUG的解决方法

Web开发
IE 缓存策略的BUG的解决方法

10个常见的IE bug和解决方法

Web开发
10个常见的IE bug和解决方法

s8lol主宰符文怎么配

英雄联盟 网络游戏
s8lol主宰符文怎么配

AJAX 缓存问题的两种解决方法(IE)

Web开发
AJAX 缓存问题的两种解决方法(IE)

禁止运行组策略的解决方法

windows 操作系统
禁止运行组策略的解决方法

lol偷钱流符文搭配推荐

英雄联盟 网络游戏
lol偷钱流符文搭配推荐

Ajax获取页面被缓存的解决方法

Web开发
Ajax获取页面被缓存的解决方法

CSS BUG解决方法以及CSS BUG类的小技巧

Web开发
CSS BUG解决方法以及CSS BUG类的小技巧

lolAD刺客新符文搭配推荐

英雄联盟
lolAD刺客新符文搭配推荐

SQL Server 2008 R2 超详细安装图文教程

SQL Server 2008 R2 超详细安装图文教程

服务器安全设置的几个注册表设置

服务器安全设置的几个注册表设置
下拉加载更多内容 ↓