ready() 함수는 현재 문서 구조가 로드된 후 즉시 지정된 함수를 실행하는 데 사용됩니다.
이 함수는 window.onload 이벤트와 동일합니다.
이 함수를 여러 번 호출하여 여러 함수를 바인딩할 수 있습니다. jQuery는 DOM 문서 구조가 로드된 직후 바인딩 순서에 따라 이러한 함수를 실행합니다.
참고: Ready() 기능과
요소의 onload 이벤트 바인딩 기능은 서로 완벽하게 호환되지 않으므로 동일한 페이지에서 동시에 사용하지 마세요. 로드를 사용해야 하는 경우 창이나 더 지정된 항목(예: 그림)에 로드 이벤트 핸들러를 추가하기 위해 jQuery의 Ready() 및 load()를 사용하지 마세요. 이 함수는 jQuery 객체(인스턴스)에 속합니다.Syntax
jQueryObject.ready( fn )
Parameters
매개변수 설명
fn 함수 유형은 실행해야 하는 함수를 지정합니다.
ready()는
함수 매개변수fn에 매개변수를 전달합니다. 이 매개변수는 jQuery 식별자입니다. 매개변수 이름을 사용자 정의하고 jQuery의 별칭으로 사용할 수 있습니다. 반환값
ready()
함수의 반환값은 jQuery 형태로 현재 jQuery 객체 자체를 반환합니다. window.onload 이벤트와 비교하여, Ready()는 더 높은 실행
우선순위를 갖습니다. window.onload는 실행되기 전에 이미지를 포함하여 현재 페이지의 모든 요소가 로드될 때까지 기다려야 합니다. 이미지와 같은 모든 리소스가 로드될 때까지 기다리지 않고 HTML 구조가 그려진 후 즉시 실행됩니다. 대부분의 경우 window.onload 대신 Ready()를 사용할 수 있습니다. 그러나 :target 선택기를 사용할 때와 같은 몇 가지 예외가 있습니다. window.onload 이벤트를 사용해야 합니다(이 이벤트는 문서 구조 외부의 항목에도 의존하기 때문입니다).
예제 및 설명
ready() 함수에는 다음과 같은 세 가지 동일한 형식이 있습니다.
function handler(){
//다음은 실행해야 하는 코드입니다
}
// 양식 1
$ (
document$( ).ready( handler ) // 이 양식은 권장되지 않습니다
// 양식 3
$( handler );
다음과 같이 이 HTML 코드를 예로 들어 보겠습니다.
아래 jQuery 샘플 코드는 Ready() 함수의 구체적인 사용법을 보여주기 위해 사용됩니다:
// Form 1
$(document).ready( function(){
// 클릭 이벤트를 btn에 바인딩 버튼
$("# btn "). CLICK (Function () {
Alert (" 버튼을 클릭하세요! ");
}) ("#message").html( ' 문서 로드됨!' );
} );
여러 JS 라이브러리가 공존하는 경우 이러한 상황에서는 $ 변수의 제어권이 다른 사용자에게 주어질 수 있습니다. Prototype과 같은 JS 라이브러리. 이 시점에서는 전역 범위에서 jQuery 변수만 사용할 수 있습니다. 그러나 Ready() 함수는 매개변수를 전달하므로 매개변수 이름을 사용자 정의하여 함수 내에서 $ 변수를 계속 사용하여 jQuery 라이브러리에 액세스할 수 있습니다. jQuery에 액세스하려면 매개변수 변수를 사용하세요.
// 프로토타입 라이브러리 파일 로드
// jQuery 라이브러리 파일 로드
//변수 제어권 포기 $
jQuery.noContribute();
// 프로토타입을 기반으로
DOM 작업 수행( 변수 $의 제어는 Prototype)
$("myDiv").setStyle( {color: "#ffffff"} );
jQuery(document).ready( function( $ ){
/ / 함수에서 내부적으로 변수 $
$("#message").html( "현재 jQuery 버전은 다음과 같습니다. " + $.fn.jquery );를 사용하여 jQuery에 액세스할 수 있습니다. jQuery(document).ready( function( abc ){
// 함수 내에서 abc 변수를 사용하여 jQuery에 액세스할 수 있습니다
abc("#message").html( "현재 jQuery 버전은 다음과 같습니다. " + abc.fn.jquery )
} );
위 내용은 jQuery.ready() 함수 인스턴스 사용법에 대한 자세한 설명의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!