다른 분의 예시를 수정해봤는데 이렇게 하는게 더 컴팩트한 것 같아요! 다른 사람들의 말을 바꿔 말하면, DOM 객체에 Js 객체(예: 이벤트 핸들러)에 대한 참조가 포함되어 있고 이 Js 객체가 DOM 객체에 대한 참조를 보유하고 있는 경우 순환 참조로 충분하므로 메모리 누수가 발생했습니다. . "코드 실행"을 클릭하고 작업 관리자를 열어 메모리 변경 사항을 확인하세요. ie8과 ff에서 각각 테스트한 결과 차이점은 말할 필요도 없습니다.
코드 실행
다음과 같이 코드 코드를 복사합니다.
<html>
<머리>
<title>메모리 누수</title>
<스타일>
몸{
패딩: 10px;
}
</style>
</head>
<본문>
</body>
<스크립트>
var q = [];
var n = 0;
setInterval(함수(){
q.push(makeSpan());
if(q.길이>=10){
var s = q.shift();
만약(들){
s.parentNode.removeChild(s);
}
}
n++;
},10);
함수 makeSpan(){
var s = document.createElement("span");
document.body.appendChild(들);
var t=document.createTextNode("*** " + n + " ***");
s.appendChild(t);
s.onclick=function(e){
s.style.BackgroundColor="빨간색";
경고(n);
};
반환 s;
};
</script>
</html>
그렇다면 ie에서 어떻게 해결하나요?
노드를 삭제할 때 순환 참조를 수동으로 끊고 다음과 같이 내부의 setInterval 코드를 약간 변경합니다.
다음과 같이 코드 코드를 복사합니다.
setInterval(함수(){
q.push(makeSpan());
if(q.길이>=10){
var s = q.shift();
만약(들){
s.onclick = null;//핵심은 여기에 있습니다
s.parentNode.removeChild(s);
}
}
n++;
},10);