jQuery 제이쿼리의 문법에 대해서 알아봅시다.

jQuery 문법

jQuery에서는 HTML 엘리먼트를 선택하고 그 엘리먼트에 “액션”을 수행할 수 있습니다.

 

 

[jQuery 문법 예제]

$(this).hide()

해당 HTML 엘리먼트를 감추게 하는 jQuery hide() 메소드

$(“#test").hide()

id가 test인(id="test") 엘리먼트를 감추게 하는 jQuery hide() 메소드

$(“p").hide()

모든 <p> 엘리먼트를 감추게 하는 jQuery hide() 메소드

$(“.test").hide()

class가 test인(class="test") 모든 엘리먼트를 감추게 하는 jQuery hide() 메소드

 

[jQuery 문법]

jQuery 문법은 HTML 엘리먼트를 원하는대로 선택하고 그 엘리먼트에 어떤 액션을 수행하게 만듭니다.

기본 문법은, $(selector).action()

- $표시는 jQuery라는 것을 정의하고

- (selector)는 “질의하거나 찾을” HTML 엘리먼트를 의미하며

- jQuery action()은 이 엘리먼트가 수행할 액션입니다.

예제를 들어보면,

$(this).hide() - 현재의 엘리먼트를 감춘다

$(“p").hide() - 모든 단락들을 감춘다

$(“p.test").hide() - class가 test인(class="test") 모든 단락을 감춘다

$(“#test").hide() - id가 test인(id="test") 모든 엘리먼트를 감춘다

※jQuery는 XPATH와 CSS selector 문법을 혼합해서 사용합니다.

※다음 강좌에서는 selector 문법에 대해서 더 알아볼 것입니다.

 

[Document Ready Function]

이전 강좌의 예제에서 모든 jQuery 메소드가 document.ready() 함수 안에 있다는 것을 기억하시는지.

$(document).ready(function() {

// jQuery 함수들은 여기에...

});

jQuery 메소드가 document.ready() 함수안에 넣는 이유는 jQuery 코드가 문서가 로딩이 끝나기 전(혹은 문서가 준비되기 전)에 실행되는 것을 막기 위한 것입니다.

문서가 완전히 로드되기 전에 함수가 실행된다면 오류가 날 수 있는 몇 가지 경우가 있습니다.

- 존재하지 않는 엘리먼트를 감추려고 할 때

- 로드되지 않은 이미지의 사이즈를 얻으려고 할 때

 

 

 

감사합니다.

출처

http://blog.naver.com/topsaga?Redirect=Log&logNo=140155602632