>웹 프론트엔드 >JS 튜토리얼 >javascript 이벤트 로딩 및 preloading_javascript 기술

javascript 이벤트 로딩 및 preloading_javascript 기술

WBOY
WBOY원래의
2016-05-16 18:38:251167검색

일반적으로, 여러 이벤트를 로드하려면 window.onload로 충분합니다.

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

window.onload = function(){
func1()
func2()
func3(); // 추가 로딩 이벤트… 예를 들어 현재 영역이 관리자용인 경우 페이지가 백그라운드에서 생성되면 페이지의 이 부분은 사용자가 관리자인 경우에만 생성되며 이 부분도 일부 특수 스크립트를 사용합니다. 위의 방법은 쓸모가 없습니다. !



코드 복사
코드는 다음과 같습니다. //백엔드 코드< script type= "text/javascript"> window.onload = function(){
func1()
func2()
//일반 사용자가 사용하는 스크립트 로드...
}

<%# 다음 스크립트는 관리자를 위해 준비되었습니다%>
<% if @user.role == "manager" %> window.onload = function(){
func1();
func2()
//기밀 스크립트 로드...
<% end %


이 경우 생성된 페이지에는 두 개의 window.onload 코드 블록이 있습니다. 분명히 두 번째 코드가 첫 번째 코드를 덮어씁니다. 이때 loadEvent 함수가 나타날 차례입니다.




코드 복사


코드는 다음과 같습니다.window.onload = function() {
oldonload();
fn();
}
}
}


사용 방법은 다음과 같습니다. :




코드 복사


코드는 다음과 같습니다.
loadEvent(func1); loadEvent(func2); loadEvent(func3);//더 많은 로딩 이벤트 그러나 실제 문제는 항상 예상치 못한 일이고 까다롭습니다. 최근에는 유명한 $ DOM 선택기와 같은 이름 충돌을 피하기 위해 모든 기능을 클로저에 넣고 싶습니다. JQuery, Prototype, mootool 모두 이를 선택기 이름으로 사용하고 있어 공존이 심각한 문제가 되었습니다.



코드 복사

코드는 다음과 같습니다.

(function(){ if (!window .JS){ window['JS'] = {} } var onReady = function(fn){ var oldonload = window.onload if (typeof; window.onload != 'function') {
window.onload = fn;
}else {
window.onload = function() {
oldonload()
fn();
}
}
}
JS.onReady = onReady;
var $ = function(id){
return document.getElementById(id)
JS.$ = $;
})()










폐쇄 환경에서 이벤트 로딩

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