[jQuery] 2. 문법(Syntax) - jQuery 강좌

jQuery Syntax

 jQuery를 사용하여 HTML 요소를 선택하고 그들을 가지고 "액션"을 수행할 수 있습니다.

1. jQuery Syntax

 jQuery 문법은 HTML 요소를 선택하기 위한 안성맞춤의 문법이고 요소의 어떤 액션을 수행하기 위한 문법입니다.

 기본 문법은 $(selector).action() 입니다:

  - $ 마크로 선언/접근 하는 jQuery 문법입니다.

  - (selector)는 HTML 요소를 찾는 문법입니다.

  - action()은 요소가 수행할 액션입니다.

 예제:

  - $(this).hide() : 현재 요소를 숨깁니다.

  - $("p").hide() : 모든 <p> 요소를 숨깁니다.

  - $(".test").hide() : 클래스가 "test"인 모든 요소를 숨깁니다.

  - $("#test").hide() : 아이디가 "test"인 요소를 숨깁니다.

 * CSS 선택자와 비슷하다구요?

  jQuery는 요소를 선택하는데 CSS 문법을 사용합니다. 

2. The Document Ready Event

 

$(document).ready(function(){

   // jQuery methods go here...

});

 위 문법은 문서가 로딩을 끝내기 이전에 실행되기를 방지하는 jQuery 문법입니다.

 jQuery로 작업하기 이전에 문서가 완전히 로드되고 준비되어질때까지 기다리는 것은 좋은 형태입니다.

 위 코드는 문서의 body나 head 섹션에 위치 할 수 있습니다.

 아래 액션의 예제는 문서가 완전히 로드되기 전에 jQuery를 실행하였을때 실패하는 경우 입니다:

  - 아직 생성되지 않은 요소를 숨기려고 시도할 경우

  - 아직 로드되지 않은 이미지의 사이즈를 가져오려는 경우

 팁: jQuery 팀은 문서가 준비되는 경우 이벤트를 좀 더 짧은 메소드로 가지고 있습니다:

$(function(){

   // jQuery methods go here...

});

 jQuery 강좌, 제이쿼리, jQuery, 강좌, JavaScript 프레임워크

 

 

[출처: w3schools]