$ (function () {})은 무엇입니까? 하다?


208

때로는 함수를 만들고 나중에 함수를 호출합니다.

예:

function example { alert('example'); }
example(); // <-- Then call it later

어떻게 든 일부 함수를 호출 할 수 없습니다. 내부에서 해당 함수를 호출해야합니다.

$(function() { });

무엇 $(function() {});(function() { });의미하며, 차이점과 목적은 무엇입니까?

답변:


307
$(function() { ... });

jQuery의 약자입니다.

$(document).ready(function() { ... });

그것이 무엇을하기 위해 설계된 것은 페이지의 모든 DOM 요소가 사용될 준비가되면 함수가 호출되도록하는 것입니다.

그러나 나는 그것이 당신이 겪고있는 문제라고 생각하지 않습니다. '어떻게하면 일부 함수를 호출 할 수 없으며 내부에서 해당 함수를 호출해야합니다'라는 의미를 명확하게 알 수 있습니까? 어쩌면 예상대로 작동하지 않는 것을 보여주는 코드를 게시 할 수 있습니까?

편집 : 질문을 다시 읽으면 페이지로드가 완료되기 전에 함수가 실행 중이므로 제대로 실행되지 않을 수 있습니다. $ (function)에 넣으면 실제로 고칠 것입니다!


2
만약에 $ (function () {}); 이미 $ (document) .ready ()에 있습니까?
jwchang

이미 $ (document) ready ()에 있지만 $ (function () 없이는 작동하지 않습니다
jwchang

좋은 질문! jQuery가 당신이 올바른 위치에 있다는 것을 알고 있기 때문에 그것이 효과가 있어야한다고 생각합니다. .ready () 안에 있다면 정상적으로 함수를 호출 할 수 있습니다. 작동하지 않으면 샘플을 게시하거나 더 나은 방법으로 jsfiddle.net으로 바이올린을 만들어보십시오.
Russ Clarke

4
@JeongWooChang 그렇게 (function () { ... })();하세요. ()함수를 호출 하려면 추가 해야합니다.
Šime Vidas

3
"경험이 풍부한 개발자는 간결한 표현 $()을 사용하기도합니다 $( document ).ready(). jQuery에 익숙하지 않은 사람들이 볼 수있는 코드를 작성하는 경우 긴 형식을 사용하는 것이 가장 좋습니다." - learn.jquery.com
thdoan

15

다음은 jQuery 함수 호출입니다.

$(...);

"jQuery 함수"입니다. $함수이며 함수 $(...)를 호출하고 있습니까?

제공 한 첫 번째 매개 변수는 다음과 같습니다.

function() {}

매개 변수는 지정한 $함수 이며 DOM로드가 완료되면 제공된 메소드를 호출합니다.



5

Javascript와 jQuery 메소드를 혼동하고 있다고 생각합니다. 바닐라 또는 일반 자바 스크립트는 다음과 같습니다.

function example() {
}

그 자연의 기능은 언제 어디서나 호출 될 수 있습니다.

jQuery (Javascript 기반 라이브러리)에는 일반적으로 DOM을 호출하기 전에 완전히 렌더링해야하는 기능이 내장되어 있습니다. 완료시 구문은 다음과 같습니다.

$(document).ready(function() {
});

따라서 접두사 $또는 단어 가있는 jQuery 함수는 jQuery일반적으로 해당 메소드 내에서 호출됩니다.

$(document).ready(function() {        
    // Assign all list items on the page to be the  color red.  
    //      This does not work until AFTER the entire DOM is "ready", hence the $(document).ready()
    $('li').css('color', 'red');   
});

해당 블록의 의사 코드는 다음과 같습니다.

문서 객체 모델 $(document)이 준비 .ready()되면 다음 함수를 호출하십시오 function() { }. 이 함수 <li>에서 페이지의 모든 항목을 확인 $('li')하고 jQuery 메소드 .CSS ()를 사용하여 CSS 속성 "color"를 "red"값으로 설정하십시오..css('color', 'red');


당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.