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

Barbara Streisand
풀어 주다: 2024-10-20 10:23:30
원래의
1084명이 탐색했습니다.

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 중국어 웹사이트의 기타 관련 기사를 참조하세요!

원천:php
본 웹사이트의 성명
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
저자별 최신 기사
인기 튜토리얼
더>
최신 다운로드
더>
웹 효과
웹사이트 소스 코드
웹사이트 자료
프론트엔드 템플릿