>  기사  >  웹 프론트엔드  >  여러 함수를 로드하고 function_javascript 기술을 추가하는 js window.onload에 대한 자세한 설명

여러 함수를 로드하고 function_javascript 기술을 추가하는 js window.onload에 대한 자세한 설명

WBOY
WBOY원래의
2016-05-16 17:05:021550검색

프로젝트를 할 때 window.onload를 사용해야 하는 경우가 많습니다.

은 다음과 같이 사용됩니다.

function func(){alert("창 온로드 이벤트입니다!");return;}

window.onload=func;

또는 다음과 같습니다:

window.onload=function(){alert("창 온로드 이벤트입니다!");return;}

그러나 window.onload는 동시에 여러 기능을 로드할 수 없습니다.

예:

함수 t(){
alert("t")
}
함수 b(){
alert("b")
}
window.onload =t ;
window.onload =b ;

나중에 이전 코드를 덮어쓰게 되며, 위 코드는 b만 출력하게 됩니다.

이 문제를 해결하려면 다음 방법을 사용할 수 있습니다.
window.onload =function() { t() }

또 다른 해결 방법은 다음과 같습니다.

코드 복사 코드는 다음과 같습니다.

function addLoadEvent(func) {
var oldonload = window.onload;//이전 onload 이벤트의 함수 가져오기
if (typeof window.onload != 'function') {/ /유형이 'function'인지 확인합니다. typeof는 문자열을 반환합니다.
window.onload = func;
} else {
window.onload = function() {
oldonload(); //onload 이벤트 함수 호출 전 오버라이드---->js에 대해 잘 모르기 때문에 일시적으로 onload 이벤트 함수를 오버라이드하여 여러 함수를 로딩하는 것으로 이해합니다
func(); //현재 이벤트 함수 호출
}
}
}

//(전체 예시)는 다음과 같이 사용됩니다.

함수 t(){
alert("t")
}
함수 b(){
alert("b")
}
함수 c(){
alert("c")
}
function addLoadEvent(func) {
var oldonload = window.onload;
if (typeof window.onload != 'function') {
window.onload = func;
} else {
window.onload = function() {
oldonload();
func();
}
}
}

addLoadEvent(t);
addLoadEvent(b);
addLoadEvent(c);
//window.onload =function() { t(); ;}


개인적으로는 암시적 함수(예: window.onload =function() { t(); b(); c() ;})를 직접 사용하는 것이 더 빠르다고 생각합니다. 물론, addLoadEvent를 사용하세요. 좀 더 전문적으로 행동하고 모두가 자신만의 접근 방식을 취해야 합니다!

JS window.onload 추가 기능:

코드 복사 코드는 다음과 같습니다.

<script><br>if(window.attachEvent)//IE: window.attachEvent 함수가 브라우저에 존재하는 경우 window.attachEvent 함수를 사용하여 IE인지 확인할 수 있습니다. 다음도 사용하세요: if (document.all ){//..}<br>window.attachEvent("onload",function() {alert("add method");});<br>else //FireFox<br>window.addEventListener("load" ,function() {alert("add method");},true);<br></script>

이 실행되면 경고 메시지가 나타납니다. js에서는 문제가 해결되었습니다.

============관련정보================

attachEvent 이벤트가 객체에서 발생할 때마다 함수가 호출되도록 지정된 함수를 이벤트에 바인딩합니다.

Internet Explorer는 5.0부터 attachmentEvent 메소드를 제공합니다. 이 메소드를 사용하면 하나의 이벤트에 여러 처리 프로세스를 할당할 수 있습니다. AttachEvent는 현재 Opera에서도 작동합니다. 하지만 Mozilla/Firefox는 이 방법을 지원하지 않습니다. 그러나 이는 attachmentEvent와 유사하고 이벤트에 여러 핸들러를 할당하는 데에도 사용되는 또 다른 addEventListener 메소드를 지원합니다. 그러나 그들이 할당하는 이벤트에는 약간의 차이가 있습니다.attachEvent 메소드에서는 이벤트가 "on"으로 시작하지만 addEventListener에서는 이벤트가 "on"으로 시작하지 않습니다. 또한 addEventListener에는 일반적으로 이 매개변수가 있습니다. 매개변수가 false로 지정되었습니다.

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.