IE下使用jQuery重置iframe地址时内存泄露问题解决办法

页面中有个iframe:

复制代码 代码如下:

 
测试IFRAME泄露

其中a.html内容如下：

复制代码 代码如下:

后缀"\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有效

复制代码 代码如下:

SPAN

b.html内容如下：

复制代码 代码如下:

SPAN

网上有传，如下写法可降低内存泄露：

复制代码 代码如下:

 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左右。

写法二：按网传写法

复制代码 代码如下:

使用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("");
   flag = false;
  }else{
   /*
   try{
    frameDom.contentWindow.document.write('');
    frameDom.contentWindow.document.clear();
    frameDom.contentWindow.close();
      }catch(e){};
      */
      $('iframe:eq(0)').remove();
      $('body').append("");
   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("");
   flag = false;
  }else{
   try{
    frameDom.contentWindow.document.write('');
    frameDom.contentWindow.document.clear();
    frameDom.contentWindow.close();
      }catch(e){};
      $('iframe:eq(0)').remove();
      $('body').append("");
   flag = true;
  }
 });

此写法与写法3并没有明显差别，每次切换#leaks仍然增加3左右

因此可以得出结论，最好的解决重置iframe地址内存泄露办法就是 把它干掉，再添加一个！

网传不一定靠谱啊

注：本机测试环境为 WIN7 x64 IE9