>  기사  >  웹 프론트엔드  >  프레임워크를 사용하지 않고 Javascript에서 DOM 준비 상태를 확인하는 다른 방법이 있습니까?

프레임워크를 사용하지 않고 Javascript에서 DOM 준비 상태를 확인하는 다른 방법이 있습니까?

Barbara Streisand
Barbara Streisand원래의
2024-10-20 10:23:301080검색

Is There an Alternative Way to Check for DOM Readiness in Javascript Without Using Frameworks?

Javascript에서 문서 준비 확인

질문:

확인할 수 있는 다른 방법이 있습니까? 프로토타입이나 jQuery와 같은 프레임워크에 의존하지 않고 Javascript에서 DOM을 준비하려면?

답변:

옵션 1: DOMContentLoaded 이벤트

DOMContentLoaded 이벤트는 초기 HTML 문서가 구문 분석되고 DOM을 조작할 준비가 되면 발생합니다. 이 이벤트를 사용하려면:

function fireOnReady() { /* ... */ }
if (document.readyState === 'complete') {
    fireOnReady();
} else {
    document.addEventListener("DOMContentLoaded", fireOnReady);
}

이 이벤트는 페이지가 로드될 때 한 번만 실행됩니다.

옵션 2: jQuery의 isReady 속성(문서화되지 않음)

jQuery에는 DOM 준비 상태를 확인하는 데 사용할 수 있는 isReady라는 문서화되지 않은 속성이 있습니다.

if($.isReady) {
    // DOM is ready
} else {
    // DOM is not yet ready
}

이 속성은 신뢰할 수 있지만 신뢰할 수는 없습니다. 공식적으로 문서화되었으며 향후 jQuery 버전에서는 제거될 수 있습니다.

옵션 3: 사용자 정의 ReadyState 검사

Dustin Diaz에서 영감을 받아 검사하는 사용자 정의 DOM 지원 스니펫을 생성할 수 있습니다. document.readyState 속성:

if( !/in/.test(document.readyState) ) {
    // document is ready
} else {
    // document is NOT ready
}

이는 document.readyState 속성이 "로딩", "대화형" 및 "대화형"의 세 가지 로드 상태를 거치기 때문에 작동합니다. "완벽한". "로딩"과 "대화형" 모두 "in"이라는 텍스트를 포함하며 이는 DOM이 아직 준비되지 않았음을 나타냅니다.

위 내용은 프레임워크를 사용하지 않고 Javascript에서 DOM 준비 상태를 확인하는 다른 방법이 있습니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

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