Solution to memory leak problem when using jQuery to reset iframe address under IE

Solution to memory leak problem when using jQuery to reset iframe address under IE_jquery

WBOY

Release： 2016-05-16 16:15:28

Original

1339 people have browsed it

There is an iframe in the page:

Copy code The code is as follows:

The content of a.html is as follows:

Copy code The code is as follows:

Insert title here

The suffix "9" is valid for IE6/IE7/IE8/IE9/IE10 suffix" Suffix "9 The prefix "*" is valid for IE7

The prefix " " is valid for IE7
Selector prefix @media screen and (-ms-high-contrast: active), (-ms-high-contrast: none)

Valid for IE10

Copy code

The code is as follows:

SPAN

The content of b.html is as follows:

Copy code

The code is as follows:

Insert title here

SPAN

There is a rumor on the Internet that the following writing method can reduce memory leaks:

Copy code

The code is as follows: var frameDom = $('iframe:eq(0)')[0]; var frameWin = frameDom.contentWindow;

try{ 

frameWin.document.write(''); 

frameWin.document.clear(); 

}catch(e){}; 

frameDom.src = 'b.html';

So what’s the effect?

Writing method one: directly set the URL

Copy code

The code is as follows:

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 ? 'Switch to a.html': 'Switch to b.html');

});

Test using sIEve: #leaks increases by about 28 every time you switch.

Writing method 2: Online writing method

Copy code The code is as follows:

<script><br>
var flag = true;<br>
var frameDom = $('iframe:eq(0)')[0];<br>
$('button').on('click',function(){<br>
if(flag){<br>
      var frameDom = $('iframe:eq(0)')[0];<br>
var frameWin = frameDom.contentWindow;<br>
        try{ <br>
frameWin.document.write(''); <br>
frameWin.document.clear(); <br>
        }catch(e){}; <br>
frameDom.src = 'b.html';<br>
flag = false;<br>
}else{<br>
      var frameDom = $('iframe:eq(0)')[0];<br>
var frameWin = frameDom.contentWindow;<br>
        try{ <br>
frameWin.document.write(''); <br>
frameWin.document.clear(); <br>
        }catch(e){}; <br>
frameDom.src = 'a.html';<br>
flag = true;<br>
}<br>
//$('#console').append(flag ? 'Switch to a.html': 'Switch to b.html');<br>
});<br>
</script>

Test using sIEve: #leaks increases by about 28 every time you switch. There is no difference from the way of writing

Writing method three:

Copy code The code is as follows:

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;

}

});

Using sIEve test: the average #leaks is 3, which is a huge difference from the first two

Writing method 4: Notice that a piece of code is commented in method 3. What will happen if you remove the comment?

Copy code The code is as follows:

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;

}

});