javascript代码实例教程-IE下使用jQuery重置iframe地址时内存泄露问题解决办法
脚本宝典收集整理的这篇文章主要介绍了javascript代码实例教程-IE下使用jQuery重置iframe地址时内存泄露问题解决办法，脚本宝典觉得挺不错的，现在分享给大家，也给大家做个参考。小宝典致力于为广大程序猿（媛）提供高品质的代码服务，请大家多多光顾小站，小宝典在此谢过。
IE下使用jQuery重置iframe地址时内存泄露问题解决办法，代码如下:
<iframe src='a.htML'></iframe>
<button>测试IFRAME泄露</button>
其中a.html内容如下：
代码如下:
<!DOCTYPE html>
<html>
<head>
<;meta charset="UTF-8">
<tITle>Insert title here</title>
<script type="text/javascript" src="jquery/jquery.min.js"></script>
<style>
.hack{
/* 1.所有浏览器都有效 */
background-color:green;
/* 2.IE8~IE10,opera有效,但是Opera兼容性可以不考虑 */
background-color:blue/0;
/* 3.IE9~IE10有效,与2组合，在2中先写针对IE8的，在此条中针对IE9|IE10 */
background-color:red/9/0;
/* 4.IE7有效,与23组合能区分出IE7/IE8/(IE9|IE10) */
+background-color:yellow;
}
/* 针对IE10+ */
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {
.hack{
background-color:pink;
}
}
</style>
</head>
<body>
后缀"/9" IE6/IE7/IE8/IE9/IE10都生效
后缀"/0" IE8/IE9/IE10都生效，是IE8/9/10的hack
后缀"/9/0" 只对IE9/IE10生效，是IE9/10的hack
前缀"*" 对IE7有效
前缀"+" 对IE7有效
选择器前缀 @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none)
针对IE10有效
代码如下:
<input type='text' value='中文'></input>
<p class='hack' style="width:100px;
height:100px;"></p>
<p id="1" style="padding:5px;position:relative;background-color:green;margin:10px;border:20px solid red;width:100%;height:200px;">
</p>
<p id="2"></p>
<span>SPAN</span>
</body>
</html>
b.html内容如下：
代码如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="jquery/jquery.min.js"></script>
</head>
<body>
<span>SPAN</span>
</body>
</html>
网上有传，如下写法可降低内存泄露：
代码如下:
VAR frameDom = $('iframe:eq(0)')[0];
var frameWin = frameDom.contentWindow;
try{
frameWin.document.write('');
frameWin.document.clear();
}catch(e){};
frameDom.src = 'b.html';
那么效果怎样呢？
写法一：直接设置URL
代码如下:
var flag = true;
var frameDom = $('iframe:eq(0)')[0];
$('button').on('click',function(){
if(flag){
var frameDom = $('iframe:eq(0)')[0];
var frameWin = frameDom.contentWindow;
/*
try{
frameWin.document.write('');
frameWin.document.clear();
}catch(e){};
*/
frameDom.src = 'b.html';
flag = false;
}else{
var frameDom = $('iframe:eq(0)')[0];
var frameWin = frameDom.contentWindow;
/*
try{
frameWin.document.write('');
frameWin.document.clear();
}catch(e){};
*/
frameDom.src = 'a.html';
flag = true;
}
//$('#console').append(flag ? '切换到a.html':'切换到b.html');
});
使用sIEve测试：每切换一次，#leaks增加28左右。
写法二：按网传写法
代码如下:
<script>
var flag = true;
var frameDom = $('iframe:eq(0)')[0];
$('button').on('click',function(){
if(flag){
var frameDom = $('iframe:eq(0)')[0];
var frameWin = frameDom.contentWindow;
try{
frameWin.document.write('');
frameWin.document.clear();
}catch(e){};
frameDom.src = 'b.html';
flag = false;
}else{
var frameDom = $('iframe:eq(0)')[0];
&nbnbsp; var frameWin = frameDom.contentWindow;
try{
frameWin.document.write('');
frameWin.document.clear();
}catch(e){};
frameDom.src = 'a.html';
flag = true;
}
//$('#console').append(flag ? '切换到a.html':'切换到b.html');
});
</script>
使用sIEve测试：每切换一次，#leaks增加28左右。与写法一并没有什么差别
写法三：
代码如下:
var flag = true;
var frameDom = $('iframe:eq(0)')[0];
$('button').on('click',function(){
if(flag){
/*
try{
frameDom.contentWindow.document.write('');
frameDom.contentWindow.document.clear();
frameDom.contentWindow.close();
}catch(e){};
*/
$('iframe:eq(0)').remove();
$('body').append("<iframe src='b.html'></iframe>");
flag = false;
}else{
/*
try{
frameDom.contentWindow.document.write('');
frameDom.contentWindow.document.clear();
frameDom.contentWindow.close();
}catch(e){};
*/
$('iframe:eq(0)').remove();
$('body').append("<iframe src='a.html'></iframe>");
flag = true;
}
});
使用sIEve测试：#leaks平均为 3,与前两种相差巨大
写法四：注意到，写法三中注释了一段代码，去掉注释会怎样？
代码如下:
var flag = true;
var frameDom = $('iframe:eq(0)')[0];
$('button').on('click',function(){
if(flag){
try{
frameDom.contentWindow.document.write('');
frameDom.contentWindow.document.clear();
frameDom.contentWindow.close();
}catch(e){};
$('iframe:eq(0)').remove();
$('body').append("<iframe src='b.html'></iframe>");
flag = false;
}else{
try{
frameDom.contentWindow.document.write('');
frameDom.contentWindow.document.clear();
frameDom.contentWindow.close();
}catch(e){};
$('iframe:eq(0)').remove();
$('body').append("<iframe src='a.html'></iframe>");
flag = true;
}
});
此写法与写法3并没有明显差别，每次切换#leaks仍然增加3左右
因此可以得出结论，最好的解决重置iframe地址内存泄露办法就是 把它干掉，再添加一个！
网传不一定靠谱啊
注：本机测试环境为 WIN7 x64 IE9
觉得可用，就经常来吧！ 脚本宝典 欢迎评论哦！ js脚本，巧夺天工，精雕玉琢。小宝典献丑了！
脚本宝典总结
以上是脚本宝典为你收集整理的javascript代码实例教程-IE下使用jQuery重置iframe地址时内存泄露问题解决办法全部内容，希望文章能够帮你解决javascript代码实例教程-IE下使用jQuery重置iframe地址时内存泄露问题解决办法所遇到的问题。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。
- 前端学java系列（1）——搭建环境 2019-11-04
- JavaScript教程- JavaScript 语句 2018-11-21
- JavaScript教程- JavaScript 语法 2018-11-20
- JavaScript教程- JavaScript 输出 2018-11-20
- JavaScript教程- JavaScript 用法 2018-11-20
- JavaScript教程- JavaScript 简介 2018-11-20
- 重温java基础 2018-11-20
- 了解JavaScript中的Spread运算符 2018-11-17
- js数组操作常用方法超级完整版本值得收藏 2018-11-16
- 谷歌JavaScript风格指南中值得注意的13点 2018-11-11
- 前端学java系列（1）——搭建环境
- 【myeclipse】——Java 内存溢出（java.lang.OutOfMemoryError）
- dun ru jiang hu
- C语言基础知识补充
- javascript代码实例教程-Dom 学习总结及其实例
- javascript代码实例教程-Javascript：必须知道的Javascript知识点之“字面量和对应类型...
- javascript代码实例教程-Javascript：必须知道的Javascript知识点之“this指针”
- javascript代码实例教程-javascript中encodeURI和decodeURI方法
- javascript代码实例教程-EXTJs 表单控件
- javascript代码实例教程-Extjs4――实现动态的grid（即实现数据库表数据的显示）
- 前端学java系列（1）——搭建环境
- 【myeclipse】——Java 内存溢出（java.lang.OutOfMemoryError）
- dun ru jiang hu
- C语言基础知识补充
- vue项目优化--服务端渲染优化
- javascript代码实例教程-Dom 学习总结及其实例
- javascript代码实例教程-Javascript：必须知道的Javascript知识点之“字面量和对应类型...
- javascript代码实例教程-Javascript：必须知道的Javascript知识点之“this指针”
- javascript代码实例教程-javascript中encodeURI和decodeURI方法
- javascript代码实例教程-EXTJs 表单控件